Angular 带有自定义指令 templateUrl 的 Js ng-repeat
Angular Js ng-repeat with custom directive templateUrl
我在 angular js 中使用自定义指令,模板 url link 代码为 here。问题是 ngRpeat 不使用模板 url 如果我将 ngRepeat 传递给元素则它不起作用,但如果我传入模板本身它就可以工作。
更新:
以下是您在 main.html
中编写的代码
<search-results customers-d ="customers" ng-repeat="CM in customersD></search-results>
以下是您编写的指令 searchResults:
myApp.directive('searchResults', function () {
return {
templateUrl: 'directives/search.html',
scope: {
customersD: '=',
}
}
});
以下是您编写的主控制器:
myApp.controller('mainController', ['$scope', '$log', function($scope, $log) {
$scope.customers = [{ name:'Rishabh'},{name:'Krishna'}]
}]);
而search.html如下:
<a href="#" class="list-group-item">
<h4 class="list-group-item-heading"> hi </h4>
<p class="list-group-item-text">{{CM.name}}</p>
</a>
现在你做错了:
- main.html
的 ng-repeat 中缺少结束引号
- 试图访问 main.html 中的 customersD,而在 mainController 的 $scope 中没有定义名为 customersD 的数组。
- 正在尝试访问 search.html 中的 CM(这是独立范围指令的模板)。您只能在 search.html
中拥有 customersD
我认为您对范围的理解不正确。如果您在这里提问之前阅读足够多,那将是很好的。 :)
上一个答案:
您缺少 ng-repeat 中的结束引号并且使用了错误的变量
做如下:
<search-results customers-d ="CM" ng-repeat="CM in customers"></search-results>
main.html
<div class="list-group">
<search-results customers-d ="customers" ng-repeat="CM in customers"></search-results>
</div>
app.js
中的指令更改
myApp.directive('searchResults', function () {
return {
restrict : "AE",
templateUrl: 'directives/search.html'
}
});
我在 angular js 中使用自定义指令,模板 url link 代码为 here。问题是 ngRpeat 不使用模板 url 如果我将 ngRepeat 传递给元素则它不起作用,但如果我传入模板本身它就可以工作。
更新:
以下是您在 main.html
中编写的代码<search-results customers-d ="customers" ng-repeat="CM in customersD></search-results>
以下是您编写的指令 searchResults:
myApp.directive('searchResults', function () {
return {
templateUrl: 'directives/search.html',
scope: {
customersD: '=',
}
}
});
以下是您编写的主控制器:
myApp.controller('mainController', ['$scope', '$log', function($scope, $log) {
$scope.customers = [{ name:'Rishabh'},{name:'Krishna'}]
}]);
而search.html如下:
<a href="#" class="list-group-item">
<h4 class="list-group-item-heading"> hi </h4>
<p class="list-group-item-text">{{CM.name}}</p>
</a>
现在你做错了:
- main.html 的 ng-repeat 中缺少结束引号
- 试图访问 main.html 中的 customersD,而在 mainController 的 $scope 中没有定义名为 customersD 的数组。
- 正在尝试访问 search.html 中的 CM(这是独立范围指令的模板)。您只能在 search.html 中拥有 customersD
我认为您对范围的理解不正确。如果您在这里提问之前阅读足够多,那将是很好的。 :)
上一个答案: 您缺少 ng-repeat 中的结束引号并且使用了错误的变量 做如下:
<search-results customers-d ="CM" ng-repeat="CM in customers"></search-results>
main.html
<div class="list-group">
<search-results customers-d ="customers" ng-repeat="CM in customers"></search-results>
</div>
app.js
中的指令更改myApp.directive('searchResults', function () {
return {
restrict : "AE",
templateUrl: 'directives/search.html'
}
});