AngularJS添加表示数组模型的输入

AngularJS adding inputs that represent an array model

本文关键字：输入 模型 数组 添加 表示 AngularJS      更新时间：2023-12-30

我无法理解的简单AngularJS问题。

Plunkr：http://plnkr.co/edit/OjaooVOQBEETkhaZFbWG?p=preview

HTML；

    <div ng-repeat="label in likedLabels">
         <input ng-model="likedLabels[$index]">
    </div>
    {{likedLabels}}
    <button ng-click="addInput()">+add more inputs</button>

JS:

   $scope.likedLabels = ['']
   $scope.addInput = function(){
     $scope.likedLabels.push('');
   }

我基本上是在尝试创建一种用户操作的方式来添加输入框，并将其中的内容链接到模型。我在这里做错了什么？

在数组中使用对象而不是基元。像ng-repeat这样的指令为数组中的每个重复项创建单独的子作用域。

由于原型继承，对象将作为原始对象的引用传递给子作用域，而基元（字符串、布尔值等）则不会。因此，在范围树中没有基元的数据绑定

HTML

<div ng-repeat="item in likedLabels">
    <input ng-model="item.label">
</div>

JS-

 $scope.likedLabels = []
  $scope.addInput = function() {
    $scope.likedLabels.push({label: ''});
  }

DEMO

相关文章：