AngularJs ng-repeat 跟踪 $index 问题与 angular-bootstrap-switch [重复]

Question

我遇到了AngularJs ng-repeat 和angular-bootstrap-switch 的问题

我正在使用：

ng-repeat="item in items track by $index"

当我通过以下方式将新项目添加到数组的第一个索引中时：

newItem = {};    
items.splice(0, 0, newItem);

DOM 包含一个 bs 开关： 当添加一个新项目时，它会基于 $index 重用数组中的第一个元素，因此它不会重新渲染 (that's what I get from this docs)。我遇到的问题是前一个元素有 switch-on。

我遇到的 DOM 效果问题是类“switch-on”不会刷新新项目并继续。

预期：在这种情况下，我要关闭而不是像图像那样打开。因为它是一个空对象

P/s：业务原因

• 我无法为那个 Switch 添加默认值。它必须是一个空对象

• 我也无法使用项目对象的任何标识符来跟踪替换为 $index

• 如果我通过 $id 使用默认轨道，也会导致一些业务问题

使用 Angular 1.5 或更高版本的临时解决方案：

使用 angular 1.5，您可以使用 angular-bootstrap-switch 0.5.1

它将修复问题，在 frapontillo 发布更改后：“在模型更改时触发“switch-change””

非常感谢您的支持。

Answer 1

我从您的问题中了解到，您想向主数组添加一个新项目，并且当它呈现时，您希望它的开关默认为 off。

你需要记住几件事。

1. ng-repeat 在我们的 DOM 中仅表现为循环。

2. 如果你想让开关默认关闭，你必须在主数组的每个项目中都有一个模型。它将跟踪 DOM 中每个开关的状态。

这是您应该尝试的方法

从你的控制器：

newItem = {switchState: 0};    
items.splice(0, 0, newItem);

来自您的 HTML：

<div ng-repeat="item in items track by $index">
<!-- your Name and Decription input fields.. -->

<input
    bs-switch
    ng-model="item.switchState" />

所以我认为你忽略了 ng-model 的 angular-bootstrap-switch 导致你的问题。