私はプロジェクトのいくつかのコードで作業していましたが、$ stateParamsの使用に問題がありました。私は解決を介して私のサービスに項目名を注入しようとしていますが、未定義で登場し続けます。私はそれを定義するために$ stateParamsが必要であることに気付きましたが、$ stateParamsをサービスに挿入することはできません。ここで私のコードとエラーです、事前に感謝します。
エラー
Uncaught Error: [$injector:modulerr]
http://errors.angularjs.org/1.6.5/$injector/modulerr?p0=MenuAppX&p1=ReferenceError%3A%20%24stateParams%20is%20not%20defined%0A%20%20%20%20at%20RoutesConfig%20(http%3A%2F%2Flocalhost%3A3000%2Fsrc%2Froutes.js%3A30%3A14)%0A%20%20%20%20at%20Object.invoke%20(http%3A%2F%2Flocalhost%3A3000%2Flib%2Fangular.min.js%3A44%3A357)%0A%20%20%20%20at%20d%20(http%3A%2F%2Flocalhost%3A3000%2Flib%2Fangular.min.js%3A42%3A237)%0A%20%20%20%20at%20http%3A%2F%2Flocalhost%3A3000%2Flib%2Fangular.min.js%3A42%3A376%0A%20%20%20%20at%20p%20(http%3A%2F%2Flocalhost%3A3000%2Flib%2Fangular.min.js%3A8%3A7)%0A%20%20%20%20at%20g%20(http%3A%2F%2Flocalhost%3A3000%2Flib%2Fangular.min.js%3A42%3A138)%0A%20%20%20%20at%20gb%20(http%3A%2F%2Flocalhost%3A3000%2Flib%2Fangular.min.js%3A46%3A251)%0A%20%20%20%20at%20c%20(http%3A%2F%2Flocalhost%3A3000%2Flib%2Fangular.min.js%3A22%3A19)%0A%20%20%20%20at%20Uc%20(http%3A%2F%2Flocalhost%3A3000%2Flib%2Fangular.min.js%3A22%3A332)%0A%20%20%20%20at%20xe%20(http%3A%2F%2Flocalhost%3A3000%2Flib%2Fangular.min.js%3A21%3A1)
at angular.min.js:7
at angular.min.js:43
at p (angular.min.js:8)
at g (angular.min.js:42)
at gb (angular.min.js:46)
at c (angular.min.js:22)
at Uc (angular.min.js:22)
at xe (angular.min.js:21)
at angular.min.js:333
at HTMLDocument.b (angular.min.js:38)
州
.state('items', {
url: '/menuItems/{itemId}',
templateUrl: 'src/MenuApp/template/items.template.html',
params: {$stateParams, itemId: null},
controller: 'itemsXController as itemsX',
resolve: {
itemsResult: ['MenuDataService, $stateParams', function
(MenuDataService, itemId, $stateParams) {
return MenuDataService.getItemsForCategory($stateParams.itemId);
}]
}
})
サービス
(function() {
'use strict';
angular.module('data')
.service('MenuDataService', MenuDataService)
.constant('categoryBasePath', "https://davids-
restaurant.herokuapp.com/menu_items.json?category=");
MenuDataService.$inject = ['$http', '$q', '$timeout','categoryBasePath'];
function MenuDataService($http, $q, $timeout, categoryBasePath) {
var service = this;
service.getAllCategory = function() {
var deferred = $q.defer();
var categoriesResult = $http({
method: "GET",
url: ('https://davids-restaurant.herokuapp.com/categories.json'),
});
$timeout(function() {
deferred.resolve(categoriesResult);
}, 800);
return deferred.promise;
}
service.getItemsForCategory = function(itemId) {
var deferred = $q.defer();
console.log(itemId);
var itemsResult = $http({
method: "GET",
url: ('https://davids-restaurant.herokuapp.com/menu_items.json?category=L'),
});
$timeout(function() {
deferred.resolve(itemsResult);
}, 800);
console.log(deferred.promise);
return deferred.promise;
}
};
})();
テンプレート(状態を呼び出す1)
<a ui-sref="items">This Page works</a>
<ol>
<li ng-repeat="item in categoriesX.categories" ui-sref="items({itemId:
categoriesX.categories[$index].short_name})">
{{ categoriesX.categories[$index].name }}
</li>
</ol>
除去する
変化解決関数から
itemid
を削除:{のitemId:ヌル}、' –関数に渡されるパラメータの数が一致しません。 '['MenuDataService、$ stateParams'、function (MenuDataService、itemId、$ stateParams){';関数には3つのパラメータがありますが、配列には2つしかありません。 – Claies