1

我有一个显示手机号码、姓名等详细信息的 div{{::mobilenumber}}, {{::name}}

在那个 div 中，有一个按钮可以在新表单中呈现相同的值

通过使用表单中的按钮，用户可以更改值，但在我显示详细信息的 div 中，单击按钮后值不会更改

<form ng-submit="form.$valid && saveDetails()">
  <input type="text" class="form-control capitalize" placeholder="Full Name" name="fullname"ng-model="address.fullname" maxlength="50"  ng-trim="true" autocomplete="off" required >
  <span><!-- Mobile Number required --></span>

  <input type="text" class="form-control capitalize" placeholder="Mobile Number" name="mobilenumber" id="mobilenumber"                        ng-model="address.mobilenumber" ng-minlength="10" maxlength="12"  ng-trim="true" autocomplete="off" required>
  <span><!-- Mobile Number required --></span>

  <button ng-click="form.submitted=true><span>Update User Details</span</button>
</form>

我只想使用单向绑定吗？

我尝试使用$scope.$broadcast('$$rebind:refresh');但仍然值没有改变。

任何帮助或指导都会对我很有帮助。

4

2 回答 2

0

当您{{mobilenumber}}在 html 中使用插值时，angular 会创建一个观察器，用于观察mobilenumber范围内的属性：

$scope.$watch('mobilenumber', function() {
   // update DOM
});

每当值更改时，DOM 就会更新。

但是，如果您使用一次绑定{{:mobilenumber}}，一旦您的回调接收到真实值，角度就会删除观察者：

var unwatch = $scope.$watch('mobilenumber', function() {
   if (value) {
     // update DOM
     unwatch();
   }
);

而且由于没有更多的观察者mobilenumber，每当您更新saveDetails()方法内范围的值时，都不会触发回调并且不会更新 DOM。

如果您计划不断更新值，则不应使用一次性绑定。使用常规绑定：

<div>{{mobilenumber}}</div>
于 2017-01-04T13:25:03.403 回答
0

如果你真的想保持某种单向绑定......

您可以做的只是使用两种方式绑定，但中间有一个数据集。它会产生一些开销，但它可能是解决您的问题的方法。为了更新视图，您只需更新复制的数据。您可以控制视图中的数据何时更新。

于 2017-01-04T13:23:43.550 回答