Проверьте, перезагружен ли подвид; Angularjs, UI-роутер

Я использую UI-маршрутизатор в угловых JS для вложения просмотров. Директива в одном из моих родительских представлений требует наблюдения, перезагружается ли подпредставление. Может кто-нибудь сказать мне, как я буду смотреть, если перезарядка внутри представления перезагружается?

Вот мой HTML

<body>
  <header myDirective></header>
  <div id="content" ui-view name="bodyContent"></div>
</body>

Директива JS

myApp.directive('myDirective', function(){
return function(scope,element,attr){
    scope.$watch('$viewContentLoaded', function(){
        element.on("click", function(){
            // do something
        });

        element.parent().find('#content').on("click", function(){
            //do something
        })
    });
};
})

Здесь $watch оператор только наблюдает за загрузкой родительского представления. Что мне нужно сделать, это добавить прослушиватель событий для #content каждый раз, когда sub view (bodyContent) изменяется или перезагружается.

1 ответ

Решение

Я смог найти решение, используя события изменения состояния под углом. Вот как я решил проблему:

До сих пор я наблюдал переменную $viewContentLoaded родительского представления, которая не сильно помогла. Мне пришлось смотреть переменную $viewContentLoaded дочернего View. Итак, сначала я проверил "Успешное изменение состояния" с помощью scope.$on('$stateChangeSuccess', function(event, toState, toParams, fromState )) Здесь переменная event это важно. Оно имеет targetScope переменная, которая является нашей заботой. Теперь все, что я сделал, смотрел $viewContentLoaded переменная targetScope и добавить прослушиватель событий для этого. Код выглядит так

myApp.directive('myDirective', function(){
    return function(scope,element,attr){
        scope.$on('$stateChangeSuccess', function(event, toState, toParams, fromState){
            event.targetScope.$watch('$viewContentLoaded', function(){
                element.on("click", function(){
                    // do something
                });

                element.parent().find('#content').on("click", function(){
                    //do something
                })
            })

        });
    };
})

Я надеюсь, что другие выиграют от этого.:)

Другие вопросы по тегам