2

入力要素をトランスクルージョンし、入力ボックスの ng-model をパラメーターとして受け取る、本質的に複雑なラベル タグであるディレクティブがあります。

<div switch model="testObject.switch">
    <input type="checkbox" ng-model="$parent.testObject.switch">
</div>

angular 1.4 にアップグレードする前は、ディレクティブをクリックすると ng-model が更新され、ディレクティブ内でウォッチがトリガーされました。

現在、ディレクティブをクリックしても入力ボックスに影響しますが、ディレクティブ内の値は影響を受けません。

この変更の原因と修正方法についての洞察をいただければ幸いです。

フィドル

4

1 に答える 1

0

あなたのフィドルを作業コードで更新しました。ディレクティブで ngModel を必要とし、その $modelValue を監視する場合、探している動作を取得できます。

HTML:

<div switch ng-model="testObject.switch">

指令：

 booleanSwitchModule.directive('switch', [function () {
  return {
    scope: {},
    require: "?^ngModel",
    link: function (scope, elem, attr, ngModel) {
        var timesChanged = 0;           

        scope.$watch(function() {return ngModel.$modelValue; }, function (val) {

            if (val != undefined) {
                alert("model changed " + ++timesChanged + " times");

                scope.switchPosition = scope.model;
            }
        });


    },
    restrict: 'EA',
    replace: true,
    transclude: true,
    template: '<label class="switch">' +
        'directive scope model: {{ngModel}}' +
        '<span ng-transclude></span>' +
        '</label>',
  }
}]);

更新されたフィドルは次のとおりです: https://jsfiddle.net/62911kx5/3/

于 2015-07-13T21:22:40.527 に答える