Question

当有人点击{{order.status}}按钮时，我想将def更改为updatestatus。

<ul>
<li ng-repeat="order in orders">
<!--
<div ng-model="row[order.id]" >abc</div>
-->
<div ng-model="row[order.id]" >{{order.status}}</div>

<a href="#" ng-click="changestatus(order.id)">updatestatus</a>
</li>

</ul>

控制器

$scope.row = {};
$scope.changestatus = function(id) {
    //console.log(id);
    $scope.row[id] = 'def';
}

它不起作用。请帮忙。

Answer 1

在您的视图中使用{{row[order.id]}}代替abc，并移除ng-model中的div。

<ul>
  <li ng-repeat="order in orders">
  <div>{{ row[order.id] }}</div>
  <a href="#" ng-click="changestatus(order.id)">updatestatus</a>
  </li>
</ul>

或者

<ul>
  <li ng-repeat="order in orders">
  <div ng-bind="row[order.id]"></div>
  <a href="#" ng-click="changestatus(order.id)">updatestatus</a>
  </li>
</ul>

Answer 2

此处您不需要ng-model。 ng-model用于inputs，textarea，select或custom form elements https://docs.angularjs.org/api/ng/directive/ngModel

<ul>
  <li ng-repeat="order in orders">
  <div>{{ row[order.id] }}</div>
  <a href="#" ng-click="changestatus(order.id)">updatestatus</a>
  </li>
</ul>

在这里，您只需要更新视图。为此ng-bind使用了https://docs.angularjs.org/api/ng/directive/ngBind

<div> ng-bind="row[order.id]"></div>和<div>{{ row[order.id] }}</div>相似

<强>更新

<ul>
  <li ng-repeat="order in orders">
  <div>{{ order.status }}</div>
  <a href="#" ng-click="changestatus(order)">Update Status</a>
  </li>
</ul>

控制器：

$scope.changestatus = function(order) {
    //console.log(order.id);
    order.status = 'the update status'; // status changed
}

AngularJS-如何改变动态模型的值

2 个答案: