孤立スコープとngモデルのディレクティブ

Question

私は、分離スコープとngModelディレクティブを使用するディレクティブを作成しようとしています。

問題：
モデルがディレクティブで更新されると、呼び出し元の値が更新されません。

HTML：

<test-ng-model ng-model="model" name="myel"></test-ng-model> 

が指令：

app.directive(
    'testNgModel', [ 
    '$timeout', 
    '$log', 

function ($timeout, $log) { 

    function link($scope, $element, attrs, ctrl) { 
     var counter1 = 0, counter2 = 0; 

     ctrl.$render = function() { 
      $element.find('.result').text(JSON.stringify(ctrl.$viewValue)) 
     } 

     $element.find('.one').click(function() { 
      if ($scope.$$phase) return; 
      $scope.$apply(function() { 
       var form = angular.isObject(ctrl.$viewValue) ? ctrl.$viewValue : {}; 
       form.counter1 = ++counter1; 
       ctrl.$setViewValue(form); 
      }); 
     }); 
     $element.find('.two').click(function() { 
      if ($scope.$$phase) return; 
      $scope.$apply(function() { 
       var form = angular.isObject(ctrl.$viewValue) ? ctrl.$viewValue : {}; 
       form.counter2 = ++counter2; 
       ctrl.$setViewValue(form); 
      }); 
     }); 

     $scope.$watch(attrs.ngModel, function (current, old) { 
      ctrl.$render() 
     }, true) 
    } 

    return { 
     require: 'ngModel', 
     restrict: 'E', 
     link: link, 
     //if isolated scope is not set it is working fine 
     scope: true, 
     template: '<div><input type="button" class="one" value="One"/><input type="button" class="two" value="Two"/><span class="result"></span></div>', 
     replace: true 
    }; 

}]); 

デモ：fiddle

Answer 1

、一般的にNG-モデルと子スコープ（scope: trueまたはscope: { ... }）を使用することは推奨されません。ただし、Arunは追加のスコーププロパティを作成する必要があるため、scope: trueはプリミティブではなくオブジェクトで使用できます。これはプロトタイプ継承を活用し、そう$parentがneeedされていません。

<test-ng-model ng-model="someObj.model" ...> 

fiddle

Answer 2

あなたが作成したので：Fiddle

_{孤立スコープは、それが正常に動作しない場合にはアイソngModel = "model"は、新しい隔離されたスコープを指します。あなたのAppControllerの範囲を参照したい場合は、$親を使用する必要があります。}

コメントで述べたように

<test-ng-model ng-model="$parent.model" name="myel"></test-ng-model>