0

メインコントローラーからディレクティブを変更しようとしています。

これは指示コードです

# directive.coffee
application.directive 'btnState', ->
    {
        restrict: 'A'
        link: (scope, el, attrs) ->
            attrs.$observe 'ngModel', (newVal) ->
                switch newVal
                    when 'loading'
                        # do something
                    when 'reset'
                        # do other thing
            el.click (event) ->
                attrs.$set 'ngModel', 'loading'
            return
    }

今私のテンプレートに

<button id="#do-btn" ng-click="doSometing()" ng-model="ns.btn_state" btn-state>Do it</button>
<button id="#cancel-btn" ng-click="ns.btn_state = 'reset'">Cancel</button>

#do-btnボタンをクリックすると正常に動作し、変更をキャッチしますが、外部$observeから変更しようとするとキャッチされませんns.btn_state

どうすればこれを解決できますか?

私はAngular 1.0.7を使用しています

4

1 に答える 1

0

attrs.$observeとはcontentではなく、特定の属性の値attrs.$setを操作するために使用されることに注意してください。

コンテンツを気にする場合は、属性の値よりも使用する必要が$watchあります。$parse

たとえば、

<input ng-model="foo" />

と

$scope.foo = "bar";

属性の値'ngModel'はで"foo"、その内容は"bar"です。

属性の値が変化することを期待しない場合、つまり補間されない場合は、それが表しているモデルの内容を読み書きするために、次のようにすることができます。

var model = $parse(attrs.foo);
var content = model(scope); // read
scope.$apply(function () {
  model.assign(scope, 'new content'); // write
});

そして、変化に対応するために

scope.$watch(attrs.foo, function (new, old) { ... });

属性が補間されている場合は、それを$observe見て解析する前に補間する必要がありますが、非常に複雑なユースケースのようです。

于 2013-09-17T22:20:00.127 に答える