Javascript 如何在angular中为模型getter setter创建闭包？

我用angular的ng repeat渲染了一些数据。我希望允许用户通过选中每个元素前面的复选框来选择视图中的元素。最简单的方法是向模型中的每个元素添加一个“selected”属性。然而，我更愿意更精细地分离关注点，而不是用UI的状态污染数据模型。此外，我正在将数据发送回服务器，我希望在这样做之前不必对其进行消毒。因此，IMO最好有一个单独的选择模型。基本上，我正在尝试这样做：

控制器：

$scope.data = [
    {'name': 'a', 'value': '1'},
    {'name': 'b', 'value': '2'},
    {'name': 'c', 'value': '3'}
];
$scope.selection = {'a': false, 'b': false, 'c': false};

$scope.createSelectionGetterSetter = function(name) {
    return function(newValue) {
        if (angular.isDefined(newValue)) {
            selection[name] = newValue;
        }
        return selection[name];
    }
};

视图：

这里的想法是让

createSelectionGetterSetter

创建一个闭包，将选择状态映射到选择模型中的正确元素。当然，它不起作用，因为Angular在ng模型中需要一个实际的getter/setter函数

---

如何创建这样的闭包并将它们作为getter/setter传递给角度视图？

使用

$watchCollection

定义

选择
变量可以轻松完成您想要的：

$scope.$watchCollection('data', function(newval) {
    $scope.selection = {};
    if( newval ) {
        angular.forEach(newval, function(val) {
            $scope.selection[val.name] = false;
        });
    }
});

并将其用作：

<input type='checkbox' ng-model='selection[row.name]' />



参见小提琴：

捕获：如果希望为
选择指定初始值，或者希望在
数据更改时保留其值，则需要进行一些调整。我相信这些或多或少都是微不足道的


如果您想使用
getterSetter
功能，只需在代码中添加
$scope.
选择[name]

小提琴：

捕获物：

使用此方法，不断地重新创建访问器函数。这可能会影响性能（速度和内存使用），至少在实际页面上是如此。要使其可视化，请在
createSelectionGetterSetter
函数的开头添加
console.log（'Creating accessor'）

当
数据
列表发生更改时，您需要额外的处理，尽管您现在可以轻松地为
选择指定初始值

谢谢你的主意。我使用了第二种方法的一个变体，将已创建的getter/setter进行记忆-请看是的，如果您想使用
getterSetter
选项，我认为这是一种方法。
<input type='checkbox' ng-model='selection[row.name]' />