Question

我在这里重述我的问题：我必须动态地将单选按钮添加到现有的单选按钮列表中。我怎么能通过Angular JS做到这一点？

Answer 1

使用ng-repeat创建单选按钮。您必须注意，由于ng-repeat为每个项目创建一个子范围，您需要为ng-model使用嵌套属性（在此示例中，result.selectedColor可以工作，但selectedColor不会。

如果你真的不想使用嵌套属性，你的替代方法是使用$ parent.selectedColor。我认为嵌套属性是更好的选择。

<form name="myForm">
  <div ng-repeat="color in colors">
    <input type="radio" ng-model="result.selectedColor" value="{{color.value}}">  {{color.name}} <br/>
  </div>  
  <tt>color = {{result.selectedColor}}</tt><br/>
</form>

然后在控制器中添加它：

$scope.result = {};
$scope.colors = [
   {name:'red', value:'red'}, 
   {name:'blue', value:'blue'}, 
   {name:'green', value:'green'}
];

工作示例：Plunker

Answer 2

实际上使用'push'我们可以在现有列表中添加一个项目。角度绑定将自动更新单选按钮列表。

如果我们需要删除一个项目，我们可以使用'splice'。

Angularjs：如何动态添加div标签的innerHTML

2 个答案: