我无法理解的简单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

10-06 12:12