AngularJSについて$ RouteParams

Question

私はちょうどAngularJSを学び始めました。 AngularJSの.serviceを使用すると、$RouteParamsを注入しても、実際には$RouteParamsを使用しないと、.serviceは機能しません。奇妙な何

myApp.service('myService', function() { 
    this.name = 'myServiceName'; 
    var self = this; 
    this.nameLength = function() { 
     return self.name.length; 
    }; 
}); 
myApp.controller('mainController', ['$scope','$log','$routeParams','myService',function($scope, $log,myService,$routeParams) { 
    $scope.handle = myService.name; 
}]); 

私はコントローラに$RouteParamsを使用する場合、それはなぜ$RouteParamsが.serviceの使用に影響を与える、働くということでしょうか？

Answer 1

問題は$routeParamsではなく、依存関係の順序が注入されています。依存関係の順序を、注釈付き依存関係と同じに交換します。あなたのコードではmyService：['$scope','$log','$routeParams','myService'の前に$routeParamsサービスに注釈を付けましたが、myServiceの後に$routeParamsを使用しているコールバック関数のパラメータとして注入されたdepndenciesでそれらを使用しています。 myService.nameを使用しようとすると、nameという名前のプロパティを持たない$routeParamsが実際に参照されます。以下のようにコードを変更してください。

myApp.service('myService',function(){ 
     this.name='myServiceName'; 
     var self=this; 
     this.nameLength=function(){ 
      return self.name.length; 
     }; 
}); 

myApp.controller('mainController', ['$scope','$log','$routeParams','myService',function($scope, $log,$routeParams, myService) { 
    $scope.handle = myService.name; 
}]); 

Answer 2

コントローラをこのように作成します。この方法はあまり混乱せず、より読みやすくなります。

myApp.controller('mainController', function($scope, $log,myService,$routeParams) { 
    $scope.handle = myService.name; 
}); 

Answer 3

Aditya Singhはすでにこれをかなりうまく説明しました。この間違いを防ぐには、次のようにコードのスタイルを変更できます。これはまた、垂直方向のスクロールができなく

myApp.controller('mainController', 
['$scope', '$log', '$routeParams', 'myService', 
function($scope, $log, $routeParams, myService) { 
    $scope.handle = myService.name; 
}]); 

あなたのコントローラには多くの注射がある場合。