Question

我无法弄清楚为什么当我的指令在元素上启用时，双向绑定失败。

考虑这个plunkr

首次删除时，tooltip={{input1Error}}会在您输入有效的电子邮件后立即更新input1变量。

添加tooltip={{input1Error}}时，在输入有效的电子邮件时，input1模型永远不会更新。

我错过了什么？

Answer 1

控制器的范围存在记录的问题。您可以通过实施以下更改来解决这个问题。

将您的控制器更改为：

app.controller('ctrl1', ['$scope','$log', function($scope, $log) {
    $scope.model = {};
}]);

表格：

<form name="myForm" novalidate>

  <div class="form-group">
    <label>Input 1 *</label>
    <input 
      class="span2" 
      name="input1id" 
      type="email" 
      ng-model="model.input1" 
      tooltip="{{model.input1error}}" 
      tooltip-placement="bottom"
      tooltip-trigger="openPopup"
      tooltip-trigger-on='openPopup'
      tooltip-trigger-off='closePopup'
      tooltip-show="myForm.input1id.$invalid"
      required
    />
    <pre>Input 1 is invalid: {{myForm.input1id.$invalid}}</pre>
    <pre>Input 1 valid email: {{!myForm.input1id.$error.email}}</pre>
    <pre>Input 1 error msg: {{model.input1error}}</pre>
  </div>
  <span class='error hidden' error-on="!myForm.input1id.$error.email" error-for='input1error'>Please enter a valid email</span>
  <span class='error hidden' error-on="!myForm.input1id.$error.required"" error-for='input1error'>This field is required</span>
</form>

为什么我的angularjs指令导致双向绑定失败？

1 个答案: