使用 Angular ui-select 时模型发生意外变化

Question

我有一个 Angular 用户界面选择，用于根据所选选项切换一些复选框（使用 ng-repeat 生成）。

复选框也可以手动切换，这就是问题所在。

场景如下：

1. 选择一个选项。某些复选框是根据$scope.recipes.available 模型上指定选项的ingredients 属性切换的。
2. 手动切换一个额外的复选框。
3. 选择不同的选项。相应的复选框已正确切换。
4. 切换回第一个选择的选项。除了切换最初在 ingredients 属性上指定的复选框之外，还切换了手动修改的复选框。在调试时，我发现 ingredients 属性已被修改。

这个plunkr 说明了这个问题。

到目前为止，在阅读了无数范围界定问题（我是 Angular 新手）并一次又一次地尝试重构我的代码之后，我无法解决这个问题。

在继续尝试再次重构代码之前，我想了解这里发生了什么。

为什么要修改ingredients 属性？

Answer 1

您的 bundles 数组正在您的 toggleBundleSelection 函数中更新。当配方选择发生变化时，没有任何东西可以重置数组。由于 bundles 在 $scope 上，因此值会在控制器实例的生命周期内保留。