Angularjs 删除图元时取消选中单选按钮

Angularjs应用程序在这里。 重复将打印包含元素的表。 其中一列包含4个单选按钮，而另一列将包含删除元素的按钮

<div ng-repeat doc in myCtrl.documents>
<input type="radio" ng-checked="doc.status == 0" ng-model="doc.status" name="status_{{doc.id}}" value="0" />Opt0
<input type="radio" ng-checked="doc.status == 1" ng-model="doc.status" name="status_{{doc.id}}" value="1" />Opt1
<input type="radio" ng-checked="doc.status == 2" ng-model="doc.status" name="status_{{doc.id}}" value="2" />Opt2
<input type="radio" ng-checked="doc.status == 3" ng-model="doc.status" name="status_{{doc.id}}" value="3" />Opt3
doc.status:{{doc.status}}
<button ng-click="myCtrl.removefunc(doc)">remove</button>

</div>  

现在，当我移除一个元素时，如果在移除的元素下面列出了其他元素，就会发生一件非常奇怪的事情。 每两行，选中的单选按钮消失。我的意思是，单选按钮在那里，但没有人被选中了。 4个单选按钮均未选中

有趣的是，doc.status的值始终显示值（0、1、2或3），即使对于丢失选中单选按钮的行也是如此

我第一次尝试使用ng值，而不是检查ng，并且。与ng中的字符串（而不是数字）进行比较已选中。 但还是没有运气。

---

文档数组的内容在我看来很好。可能是什么错误？

我建议使用filter（）。如果对象使用indexOf（），我不确定会发生什么

假设doc.id是每个文档对象的唯一属性。考虑使用Fielter（）对对象数组进行文档筛选。这将有助于提高代码的可预测性

如果您已经有了ng型号，我还将删除选中的ng

因此将代码更改为：

<div ng-repeat doc in myCtrl.documents>
<input type="radio" ng-model="doc.status" name="status_{{doc.id}}" value="0" />Opt0
<input type="radio" ng-model="doc.status" name="status_{{doc.id}}" value="1" />Opt1
<input type="radio" ng-model="doc.status" name="status_{{doc.id}}" value="2" />Opt2
<input type="radio" ng-model="doc.status" name="status_{{doc.id}}" value="3" />Opt3
doc.status:{{doc.status}}
<button ng-click="myCtrl.removefunc(doc)">remove</button>

</div>  

    function removefunc(doc) {
        myCtrl.documents = myCtrl.documents.filter(el => el.id !== doc.id);
    }

Opt0
Opt1
Opt2
Opt3
文档状态：{{doc.status}
去除
函数removefunc（文档）{
myCtrl.documents=myCtrl.documents.filter（el=>el.id！==doc.id）；
}

这听起来很疯狂，但删除name属性解决了问题。我不知道确切的原因，但在更改之后，问题消失了。

我认为您的问题是由于使用了

ng checked

。您应该只需要

ng model

和

value

。同时使用

ng checked

有时会导致令人不快的结果。你有plunker或JSFIDLE让我仔细看看吗？

<div ng-repeat doc in myCtrl.documents>
<input type="radio" ng-model="doc.status" name="status_{{doc.id}}" value="0" />Opt0
<input type="radio" ng-model="doc.status" name="status_{{doc.id}}" value="1" />Opt1
<input type="radio" ng-model="doc.status" name="status_{{doc.id}}" value="2" />Opt2
<input type="radio" ng-model="doc.status" name="status_{{doc.id}}" value="3" />Opt3
doc.status:{{doc.status}}
<button ng-click="myCtrl.removefunc(doc)">remove</button>

</div>  

    function removefunc(doc) {
        myCtrl.documents = myCtrl.documents.filter(el => el.id !== doc.id);
    }