Проверьте, перезагружен ли подвид; 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
})
})
});
};
})
Я надеюсь, что другие выиграют от этого.:)