将绑定的数据推入对象不起作用

push binded data into object doesn't work?

本文关键字:对象 不起作用 数据 绑定      更新时间:2023-09-26

演示和代码在这里:http://plnkr.co/edit/9tSbJBAE8qPr7DKeGUla?p=preview

我试图让我的选项卡动态允许用户添加更多的选项卡,但它似乎不能抓取名称,我想知道我绑定它与ngmodel。

<input type="text" ng-model="NewTabName"/>
<button ng-click="addTab()">Add</button>

js

$scope.addTab = function(){
    $scope.tabs.push({
        "name" : $scope.NewTabName
    });
    $scope.NewTabName = "";
}

Replace:

$scope.tabs.push({
      "name" : $scope.NewTabName
  });
$scope.NewTabName = "";

:

$scope.tabs.push({
      "name" : this.NewTabName //Use this instead of $scope
  });
this.NewTabName = ""; //Use this instead of $scope

问题是范围继承,NewTabName属性是在$scope的子范围上创建的。通过使用this,我可以访问触发事件的正确范围

演示

此处更新plunkr: http://plnkr.co/edit/OpVWtmt0k3LKsMPbGUIY?p=preview

你必须将ng-model绑定到某个对象的属性而不是对象本身。否则,它(即角)可能(在这种情况下是)创建一个对象NewTabName在其他范围比你认为它是。

$scope.addTab = function(){
    $scope.tabs.push({
        "name" : $scope.NewTabName.text
    });
    $scope.NewTabName.text = "";
}
<input type="text" ng-model="NewTabName.text"/>
<button ng-click="addTab()">Add</button>