angular.js - Bagaimana untuk menyelesaikan masalah yang arahan dalam AngularJS tidak bertindak balas kepada peristiwa yang dicetuskan semasa memuatkan

Question

Melaksanakan fungsi submenu. Jika item menu mempunyai submenu, ia bermakna ia mempunyai submenu Jika ia mempunyai directive, ia bermakna submenu akan dikembangkan apabila ia dimuatkan. submenu="expanded" dengan submenu-for dalam submenu menunjukkan item menu yang dimiliki oleh submenu itu, dan nilainya ialah directive item menu. Seperti: id

<a id="m1" submenu="expand">第1项</a> <a id="m2" submenu>第2项</a> <a id="m3" submenu>第3项</a>

<ul submenu-for="m1"><li>第1.1项</li><li>第1.2项</li></ul>
<ul submenu-for="m2"><li>第2.1项</li><li>第2.2项</li></ul>
<ul submenu-for="m3"><li>第3.1项</li><li>第3.2项</li></ul>

CSS hanya menggunakan

untuk mengawal atribut seperti class="submenu-expan" dan tidak akan ditulis. display

Kod AngularJS adalah seperti berikut:

.directive('submenu', ['$rootScope', function($rootScope){
    return {
        restrict: 'A',
        scope: {},
        link: function(scope, element, attrs) {
            scope.$on('submenu-toggle', function(e, id){
                if(id==attrs.id) {
                    element.toggleClass('submenu-expan');
                }
            });

            if(attrs.submenu=='expanded') {
                $rootScope.$broadcast('submenu-toggle', attrs.id);
            }

            element.bind('click', function(){
                $rootScope.$broadcast('submenu-toggle', attrs.id);
            });

        }
    }
}])

.directive('submenuFor', ['$timeout', function($timeout){
    return {
        restrict: 'A',
        scope: {},
        link: function(scope, element, attrs) {
            scope.$on('submenu-toggle', function(e, id){
                if(id==attrs.submenuFor) {
                    element.toggleClass('submenu-expan');
                }
            });
        }
    }
}])

Masalah semasa ialah ia berfungsi seperti biasa apabila bertindak balas kepada acara

, tetapi apabila bertindak balas kepada tetapan awal click, yang dalam submenu="expaned" boleh bertindak seperti biasa, tetapi yang dalam submenu mempunyai tiada tindakan. submenuFor

Apa sebabnya? Bagaimana untuk menyelesaikannya?

Answer 1

Komunikasi antara arahan memerlukan pengisytiharan pengawal dan meminimumkan siaran pada rotoskop