2017-04-08 16 views
0

You can view the error here

私はangularjsにかなり新しいですと、エラーがあるかわかりません。私は次のコードを使用してwebapiサービスを消費しようとしています。

app.jsファイル:

(function() { 
    "use strict"; 

    var app = angular.module("productManagement", 
          ["common.services"]); 

}()); 

productListCtrl.js

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

    function ProductListCtrl(productResource) { 
     var vm = this; 

     productResource.query(function (data) { 
      vm.products = data; 
     }); 
    } 
}()); 

commonservices.js

(function() { 
    "use strict"; 

    angular.module("common.services", ["ngResource"]) 
    .constant("appSettings", { 
     serverPath: "http://localhost:55755/" 
    }); 
}()); 

productResource.js

(function() { 
    "use strict"; 

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

    function productResource($resource, appSettings) { 
     return $resource(appSettings.serverPath + "/api/products/:id"); 
    } 
}); 
0 JSファイルの

Index.htmlと

<!DOCTYPE html> 
<html> 
<head lang="en"> 
    <meta charset="UTF-8"> 
    <title>Acme Product Management</title> 

    <!-- Style sheets --> 
    <link href="Content/bootstrap.css" rel="stylesheet" /> 
</head> 

<body ng-app="productManagement"> 
    <nav class="navbar navbar-default"> 
     <div class="container-fluid"> 
      <div class="navbar-header"> 
       <div class="navbar-brand">Acme Product Management</div> 
      </div> 
     </div> 
    </nav> 

    <div class="container"> 
     <div ng-include="'app/products/productListView.html'"></div> 
    </div> 

    <!-- Library Scripts --> 
    <script src="scripts/angular.js"></script> 
    <script src="Scripts/angular-resource.js"></script> 
    <!-- Application Script --> 
    <script src="app/app.js"></script> 

    <!-- Services --> 
    <script src="Common/common.services.js"></script> 
    <script src="Common/productResource.js"></script> 
    <!-- Product Controllers --> 
    <script src="app/products/productListCtrl.js"></script> 
</body> 

</html> 
+0

htmlファイルにすべてを含めてありますか? –

+0

これらのスクリプトがHTMLドキュメントに読み込まれる順序を表示できますか? – Claies

+0

index.htmlファイルを追加しました。 –

答えて

-1

正しいご注文。

<script src="app/products/productListCtrl.js"></script> 
<script src="Common/productResource.js"></script> 
<script src="Common/common.services.js"></script> 
<script src="app/app.js"></script> 
0

問題は、あなたが登録されているからproductResourceProviderを妨げているあなたはproductResource.jsのために書かれている無名関数ブロックを、実行していないということです。

変更をこの:

productResource.js

(function() { 
    "use strict"; 

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

    function productResource($resource, appSettings) { 
     return $resource(appSettings.serverPath + "/api/products/:id"); 
    } 
}); // <-- Problem lies here. 

変更するには:

関連する問題