ngModelCtrlでng-model値が更新されません。$ commitViewValue（）;

Question

私はテンプレートを持っているディレクティブを持っており、ユーザーがenterをクリックしたときにng-modelを更新しようとしています。私はイベントをキャッチして値を更新しようとしています。私は、コントローラ内の要素のウォッチャーを持っていますが、ウォッチャー機能はcommitViewValue

(function() { 
    'use strict'; 

    angular.module('aa') 
     .directive('ss', [ 
      function() { 

       return { 
        restrict: 'EA', 
        replace: true, 
        transclude: true, 
        scope: { 
         placeholder: '@' 
        }, 
        require: 'ngModel', 
        template: '<div class="clear">' + 

         '<input type="text" ng-model="ngModel" ng-model-options="{updateOn:\'change blur\'}" />' + 
         '</div>', 

       link: function (scope, elem, attrs, ngModelCtrl) { 
        elem.bind("keyup",function(e) { 
         if (e.keyCode === 13) { 
          e.stopImmediatePropagation(); 
          ngModelCtrl.$commitViewValue(); 
          scope.$apply(ngModelCtrl.$setTouched); 
         } 
        }); 
       } 

       } 
      } 
     ]); 
})(); 


$scope.$watch('pr', function(newValue,oldValue){ 
       console.log('val>>' + newValue); 
      }); 

<ss ng-model="pr"></ss> 

Answer 1

使用$setViewValueが親スコープに分離株範囲からデータを移動した後にトリガれることは決してありません：

link: function (scope, elem, attrs, ngModelCtrl) { 
     elem.bind("keyup",function(e) { 
      if (e.keyCode === 13) { 
       e.stopImmediatePropagation(); 
       ̶n̶g̶M̶o̶d̶e̶l̶C̶t̶r̶l̶.̶$̶c̶o̶m̶m̶i̶t̶V̶i̶e̶w̶V̶a̶l̶u̶e̶(̶)̶;̶ 
       //USE $setViewValue 
       ngModelCtrl.$setViewValue(scope.ngModel); 
       //scope.$apply(ngModelCtrl.$setTouched); 
      } 
     }); 

親コントローラでモデルを設定できるようにするには、片方向の<バインディングも使用してください。詳細についてDEMO on PLNKR

scope: {ngModel: '<'} 

、参照

• StackOverflow - Implementing custom form controls (using ngModel)

• AngularJS Developer Guide - Implementing custom form controls (using ngModel)

• AngularJS Developer Guide - Component-based application architecture