0

angularJS の $broadcast に問題があります。私のコントローラーは、 $compile 関数を使用して、ページの読み込み時に DOM にディレクティブ要素を動的に追加しています。

$('#container').prepend($compile('<myDirective></myDirective>')($scope));
$scope.$broadcast('loadIt', stuffIneedLoaded);

私がやりたいことは、ディレクティブが作成されたときにディレクティブ スコープ関数を呼び出すことなので、$broadcast を使用しました。現在起こっていることは、ディレクティブのレンダリングが完了する前に $broadcast が呼び出されるため、ディレクティブの scope.$on がブロードキャストを聞くことはありません。

ディレクティブ リンク関数から:

link: function (scope, element, attrs) {
        scope.$on('loadIt') = function (stuffToLoad) {
        //stuff to load
    }
}

ブロードキャストを使用する必要があるのは、コントローラーからディレクティブ データを送信する必要があるためです。

http://jsfiddle.net/5ReCu/

フィドルは機能しません。私が撮影しているものを伝えるのに役立つボイラープレートだけです。

何か案は?よろしくお願いします!

4

2 に答える 2

0

2 つのディレクティブを使用し、1 つを別のディレクティブから呼び出します。さらに、コンパイル後にブロードキャストを呼び出すスコープ メソッドを呼び出します。何かのようなもの:

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

fessmodule.controller('fessCntrl', function ($scope) {
    $scope.recall = function() {
        $scope.$broadcast('loadIt'); 
    }; 
});

fessmodule.$inject = ['$scope'];


fessmodule.directive("myDirective", function() {
    return {
        restrict: 'E',
        template: "<div>test code</div>",        
        link: function (scope, element, attrs) {
            scope.$on("loadIt", function() {
                 console.log('in myDirective on'); 
             });          

        }
    }
});

fessmodule.directive('directiveFoo', function($compile) {
    return {       
        controller: function() {
            console.log('in foo ctrl');            
        },
       link: function (scope, element, attrs) {
        var elem_0 = angular.element(element[0]);
        var a_input = angular.element($compile('<my-directive></my-directive>')(scope));
        elem_0.prepend(a_input);

           scope.recall();
        }
    }
});

デモFiddle

補足として:

コントローラーでの DOM の更新/操作を避けることを強くお勧めします。ディレクティブを使用します。このようにして、通話キューに関するほとんどの問題を制御および追跡できます。

于 2013-11-04T22:47:00.357 に答える