我是 AngularJS 的新手,正在尝试使用嵌套指令。我有一个家庭布局,其中包含以下内容
<product-list></product-list>
该指令有一个模板,该模板存在于另一个文件中。它有这样的内容
<div class="products">
<product prod-id="{{product.id}}" ng-repeat="product in products"></product>
</div>
我面临的问题product-list
是编译指令时它无法product.id
在表达式中理解。它给了我一些这样的错误
Error: Syntax Error: Token 'product.id' is unexpected, expecting [:] at column 3 of the expression [{{product.id}}] starting at [product.id}}].
指令定义为
app.directive('productList', function($compile) {
return {
restrict: 'AE',
replace: true,
controller: 'ProductListCtrl',
templateUrl: base_url + 'partials/directives/product-list.html'
};
});
app.directive('product', function() {
return {
restrict: 'AE',
controller: 'ProductCtrl',
templateUrl: base_url + 'partials/directives/product.html',
scope: {
prodId: '=prodId'
},
link: function ($scope, element, attrs) {
var num = $scope.$eval(attrs.prodId);
if(!isNaN(parseInt(num))){
$scope.prodId = num;
}
}
};
});
更新:为指令添加了控制器
myApp.controller("ProductListCtrl", ['$scope', 'ProductModel', '$stateParams', '$location', function($scope, ProductModel, $stateParams, $location) {
$scope.products = {};
//Fetch the products if we have some category for a given state
if(typeof $stateParams.categoryId != 'undefined' && typeof $stateParams.prodId == 'undefined'){
//Fetch products for selected category and page
ProductModel.getProductsByCategory($stateParams.categoryId, function(products){
$scope.products = products;
});
}
}]);
请指导我做错了什么或遗漏了什么。