2016-04-09 21 views
5

のプロパティ「クエリ」を読み取ることができません、私はAngularJSで自分を習熟し、Web APIのバックエンドへの呼び出しを行うと、私はTypeError例外を取得:未定義

angular.js:13424 TypeError: Cannot read property 'query' of undefined

のエラーを取得しています私はproductListController

(function() 
{ 
"use strict"; 
angular.module("productManagement").controller("ProductListController", ["productResource", ProductListController]); 
function ProductListController($scope, productResource) { 

    productResource.query(function (data) { 
     $scope.products = data 
    }); 
} 
})(); 
を持っています

と私はproductResource

(function() { 
"use strict"; 

angular.module("common.services").factory("productResource", ["$resource", "appSettings", productResource]) 

function productResource($resource, appSettings) { 
    return $resource(appSettings.serverPath + "/api/products/:id").query(); 
} 
}()); 

のappSettingsが一定であると呼ばれるサービスを作成しましたパスを指定します。

なぜqueryが未定義ですか?

答えて

7

お使いのコントローラが注入される次の依存関係を期待している:

$scope, productResource 

と、実際にあなたがあなたのコントローラは次のように初期化されなければならないだけ"productResource"代わり"$scope", "productResource"

のを注入されています

angular.module("productManagement").controller("ProductListController", ["$scope", "productResource", ProductListController]); 

function ProductListController($scope, productResource) { 
    // ... 
} 

渡された依存関係の名前は、コントロールのパラメータと同期する必要がありますファンクション宣言 - "productResource"を注入している瞬間に$scopeパラメータに入ります。

+0

これはすべて意味があります。 – Arianule

1

私は以前この問題を抱えていましたが、それを理解するまでには数時間かかりました。

場合によっては、"productResource""$scope"を注入し、特定の順序に従うことを確認する必要があります。私が証明してみましょう:

angular.module("productManagement").controller("ProductListController", ["$scope", "productResource", ProductListController]); 

    function ProductListController($scope, productResource) { 
     // ... 
    } 

上記のコードは常に動作しますが、いくつかのケースでは、下図のように、あなたが(私は上記のような)位置を切り替えた場合、それは動作しません。

angular.module("productManagement").controller("ProductListController", ["productResource","$scope", ProductListController]); 

    function ProductListController($scope, productResource) { 
     // ... 
    } 

今日まで、依存関係が正しい順序で挿入されていることを確認したことはありませんでした。結局のところ、あなたのコードがまだ動作していなければ、この問題はおそらく他の場所にあります。
こちらがお役に立てば幸いです。

関連する問題