Почему моя директива angularjs вызывает двустороннюю привязку?

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>