2

アプリケーションを作成しましたが、ディレクティブを持っている angularjs です。$rootScope 変数が変更されたときにディレクティブ内のいくつかのメソッドをトリガーするために、ディレクティブ内にウォッチを配置していますが、問題は $rootScope.name の場合です。値が変更されました ディレクティブ内にあるウォッチが機能していません

私のコードは以下のとおりです

ワーキングデモ

var module = angular.module('myapp', []);

module.controller("TreeCtrl", function($scope, $rootScope) {
    $scope.treeFamily = {
        name : "Parent"
    };

    $scope.changeValue = function()
    {
        $rootScope.name = $scope.userName;
    };

});

module.directive("tree", function($compile) {
    return {
        restrict: "E",
        transclude: true,
        scope: {},
        template:'<div>sample</div>',
        link : function(scope, elm, $attrs) {
           function update()
           {
           };
           scope.$watch('name', function(newVal, oldVal) {
                console.log('calling');
               update();
            }, true);
        }
    };
});
4

2 に答える 2

3 
scope: {},

分離スコープを使用します。親スコープから継承nameしないため、このスコープには存在しません。で直接定義するため$rootScope、ディレクティブでアクセスできます。

module.directive("tree", function($compile, $rootScope) {
    ...
    link : function(scope, elm, $attrs) {
       function update()
       {
       };
       $rootScope.$watch('name', function(newVal, oldVal) {

ただし、ルート スコープを使用することは最善の方法ではありません。nameそもそもルートスコープには入れません。@simonが提案したソリューションと同様に、コントローラーのスコープに入れてバインディングを使用することをお勧めします。

于 2014-12-03T10:02:04.313 に答える