модель на уровне приложения.
// Вопрос, как создать глобальную модель и подписаться на её поведение?
// Допустим, в java я использую "модель поведения" - observer. // В ангуляре есть сервисы и фабрики но или я *** или лыжи не едут. // Ниже привёл код который пытаюсь реализовать. Может кто сталкивался // и сможет подсказать как реализовать слушателей на уровня приложения // что бы изменение модели можно было узнать из любого контроллера или // юзать свои директивы? // Заранее спасибо!
var
// Пример того, что я пытаюсь добиться.
application = angular.module("Application", []);
// ...
application.directive("myStateShow", function(){
global_state_change(function(){
this.element.display = this.element.attr['my-state-show'] === global_state ? "block" : "none";
});
});
// ...
application.directive("myStateActive", function(){
global_state_change(function(){
this.element.class = this.element.attr['my-state-active'] === global_state ? "active" : "";
});
});
// ...
application.controller("Controller", function($scope) {
$scope.setState = function(new_state) {
global_state = new_state;
};
});
<div ng-app="Application">
<div class="container">
<div>
<div my-state-active="1">State 1</div>
<div my-state-active="2">State 2</div>
<div my-state-active="3">State 3</div>
</div>
<div>
<div my-state-show="1">
<h1 class="page-header">First frame</h1>
</div>
<div my-state-show="2">
<h1 class="page-header">Next frame</h1>
</div>
<div my-state-show="3">
<h1 class="page-header">Last frame</h1>
</div>
</div>
<div ng-controller="Controller">
<button ng-click="setState(1)">set state 1</button>
<button ng-click="setState(2)">set state 2</button>
<button ng-click="setState(3)">set state 3</button>
</div>
</div>
</div>
|
// Собственно сложность понимания была на уровне диспетчеризации
// глобального скопа. Т.е. насколько я понял, отдельно слушать модель // нет возможности, а в случае войны дергать весь скоп. // Прискорбно, но как то так...
/**
*
* @param {type} param1
* @param {type} param2
*/
app.service("appModel", function(){
this.state = 1;
});
/**
*
* @param {type} param1
* @param {type} param2
*/
app.directive("ngStateShow", function(appModel){
return {
link: function(scope, el, at) {
scope.$watch(function(){
if (appModel.state == at.ngStateShow) {
el.show();
} else {
el.hide();
}
});
}
};
});
/**
*
*/
app.directive("ngStateClick", function(appModel) {
return {
link: function(scope, el, at){
el.bind("click", function(){
appModel.state = at.ngStateClick;
scope.$apply();
});
}
};
});
|
Я правильно понимаю, ты хочешь динамически меня переданную в директиву модель?
Почитай сначала о создании директив и обрати внимание на параметр scope https://habrahabr.ru/post/200620/ |
| Часовой пояс GMT +3, время: 01:15. |