angularjs - 将 AngularJS 指令绑定(bind)到数组的映射

Question

我有一个接受对象数组的指令。在标记中声明指令时，作用域有一个对象数组，这些对象包装了指令所需的对象。所以我需要在数组上应用一个映射函数。这样做的正确方法是什么，以便对原始数组所做的更新反射(reflect)在指令中？

这是一个采用天真的方法的 Plunker(我很惊讶地看到除了很多 $digest 错误之外大部分都是“工作”):http://plnkr.co/edit/GUCZ3c

Answer 1

您应该避免从 Angular 表达式调用函数，除非该函数做一些非常轻量级的工作(例如快速计算)。这个question有更多关于这件事的细节。

在您的情况下，您应该缓存名称列表并将其绑定(bind)到指令。这是一个例子:

app.controller('MainCtrl', function($scope) {  
    $scope.people = [
        { name: 'Alice'}, 
        { name: 'Bob' },
        { name: 'Chuck' }
    ];

    $scope.addName = function(name) {
        $scope.people.push({name: name});
    };

    $scope.$watch(function() { return $scope.people.length; }, function() {
        $scope.names = $scope.people.map(function(p) { return p.name; });
    });
});

您的指令代码保持不变。这是 fork你的 Plunker。

更新 : 我更改了代码，所以它使用 $watch按照@KrisBraun 的建议自动更新名单。