Angular JS-模板中的ngRepeat

Question

我正在嘗試在指令中使用ngRepeat-但我真的不知道該怎么做。 我靠近嗎？

割草機是控制器中使用此指令的數組。

.directive('slider', function() {
return function() {
    template: '<slider><film><frame ng-repeat="mower in mowers">{{mower.series}}</frame></film></slider>';
    replace: true;
        scope: true;
    link: function postLink(scope, iElement, iAttrs) {
            // jquery to animate
        }
    }
});

Answer 1

是的，您很接近，但是語法已關閉。 並且您需要為示波器上的mowers分配一些東西。

.directive('slider', function() {
return {
    restrict: 'E', //to an element.
    template: '<film><frame ng-repeat="mower in mowers">{{mower.series}}</frame></film>',
    replace: true,
    scope: true, // creates a new child scope that prototypically inherits
    link: function postLink(scope, iElement, iAttrs) {
            scope.mowers = [
               { series: 1 },
               { series: 2 },
               { series: 3 }
            ];
        }
    }
});

另外，您不必本身引用<slider> 。

上面的代碼還假設您已經為<film>和<frame>了指令。

最后，如果要從外部范圍傳遞割草機數組，則可以將范圍設置更改為：

scope: {
   mowers: '='
}

然后您可以像這樣設置它：

<slider mowers="myMowers"></slider>

其中myMowers是控制器或父指令范圍內的變量。

希望對您有所幫助。