Angularjs绑定数组元素ng-repeat in指令

And*_*ndy 2 javascript arrays directive angularjs

我正在尝试使用ng-repeat和指令显示数组的元素.指令部分对解决方案很重要.但是,数组的元素未绑定并显示空值.

小提琴可以在http://jsfiddle.net/qrdk9sp5/找到

HTML

<div ng-app="app" ng-controller="testCtrl">
    {{chat.words}}
    <test ng-repeat="word in chat.words"></test>    
</div>
Run Code Online (Sandbox Code Playgroud)

JS

var app = angular.module('app', []);
app.controller("testCtrl", function($scope) {
    $scope.chat = {
        words: [
            'Anencephalous', 'Borborygm', 'Collywobbles'
        ]
    };
});
app.directive('test', function() {
    return {
        restrict: 'EA',
        scope: {
            word: '='
        },
        template: "<li>{{word}}</li>",
        replace: true,
        link: function(scope, elm, attrs) {}
    }
});
Run Code Online (Sandbox Code Playgroud)

OUTPUT

["Anencephalous","Borborygm","Collywobbles"]
•
•
•   
Run Code Online (Sandbox Code Playgroud)

预期产出

["Anencephalous","Borborygm","Collywobbles"]
•Anencephalous
•Borborygm
•Collywobbles   
Run Code Online (Sandbox Code Playgroud)

感谢您的帮助

Ani*_*bhi 5

你没绑定word.

您已经使用了隔离范围.如果你没有绑定它的scope属性,它将无法工作.

scope: {
    word: '='
},
Run Code Online (Sandbox Code Playgroud)

试试这样吧

<test word="word" ng-repeat="word in chat.words"></test>
Run Code Online (Sandbox Code Playgroud)

DEMO