我正在尝试使用列表项的自定义指令来实现 Angular Material 的虚拟重复,但在将范围属性绑定(bind)到该指令时遇到问题。
这是我所拥有的:
HTML
<md-virtual-repeat-container id="vertical-container">
<div md-virtual-repeat="item in ctrl.dynamicItems">
<foo bar="item"></foo>
</div>
</md-virtual-repeat-container>
JS
myApp.directive("foo", function(){
return {
restrict: "E",
scope: {
bar: "="
},
template: "<span>{{baz}}</span>",
link: function(scope){
scope.baz = "new " + scope.bar;
}
}
问题
虚拟滚动部分中的项目似乎在那里,但它们的值显示为 new undefined
,当我期望它们是 new 1、new 2 等时。
奇怪的是,有些项目似乎确实正确显示了它们的值(即,new 11、new 12,有时new 13>)。另外,如果我将指令的模板替换为 "<span>{{bar}}</span>"
,问题就会得到解决。这认为指令的链接功能是不必要的。这让我认为问题出在链接的时间上(这是我最好的猜测)。
这里是 corresponding CodePen snippet 的链接以获得更多说明。
有什么想法吗?
最佳答案
终于解决了-CodePen
JS
.directive("foo", function(){
return {
restrict: "E",
scope: {
bar: "="
},
template: "<span>{{test()}}</span>",
link: function(scope){
scope.test = function () {
if (angular.isDefined(scope.bar)) {
return "new " + scope.bar;
}
}
}
}
关于angularjs - 在 md-virtual-repeat 中使用 Angular 指令,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38597069/