我正在使用angular 1.5
的新component
功能划分各种内容;特别是我有一个sidenav
幻灯片菜单。
其他组件加载完成后,sidenav
需要运行其初始化代码。到目前为止,我找不到任何可以帮助我打破这种逻辑的东西。目前,我正在用这样一个混乱的黑客来完成这个。
假设这样的html体;
<body>
<container>
<navigation></navigation>
<sidenav></sidenav>
</container>
</body>
navigation
需要才能在sidenav
正确执行之前完成呈现。所以在我的组件文件中,我这样做(伪代码);
bindings = {};
require = { Container: '^container' };
$postLink = function() {
Container['Ready']();
}
bindings = {};
require = { Container: '^container' };
$postLink = function() {
if(Container['Ready'])
Container['Ready']();
}
transclude = true;
pending = 2; // controls that must finish loading
Ready = function() {
pending--;
if( pending > 0 )
return;
// code to initialize sidenav via jQuery
}
所以基本上,容器上有一个计数器,我需要加载的每个组件都调用一个递减计数器的父函数。如果这导致计数器为0,则初始化sidenav。
但是,这感觉真的很棒。有没有其他方法可以获得某种形式的通知或行为,这可以让我在真正合适的时间初始化sidenav?答案 0 :(得分:1)
你可能想到一个更好的地方悬挂这些物品,但我对手表的想法是做这样的事情:
<html ng-app="myApp">
<body ng-controller="appController as AppCtrl">
<div>
<component1/></component1>
<component2></component2>
<component3></component3>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js"></script>
<script>
angular.module("myApp",[])
.controller("appController", function($rootScope,$scope) {
var ctrl=this;
ctrl.readyForAction = readyForAction;
ctrl.letsParty = letsParty;
$scope.$watch("$rootScope.gotBeer && $rootScope.gotPizza && $rootScope.gotHockey",ctrl.readyForAction)
function readyForAction() {
if ($rootScope.gotBeer && $rootScope.gotPizza && $rootScope.gotHockey) {
ctrl.letsParty()
}
else
{
console.log("Not yet!")
}
};
function letsParty() {
alert("Let's go Red Wings!")
};
})
.component("component1", {
template:"<h1>Beer</h2>",
controller: function($rootScope) {
$rootScope.gotBeer=true;
}
})
.component("component2", {
template: "<h1>Pizza</h1>",
controller: function($rootScope) {
$rootScope.gotPizza = true;
}
})
.component("component3", {
template: "<h1>Hockey</h1>",
controller: function($rootScope) {
$rootScope.gotHockey = true;
}
})
</script>
</body>
</html>
我只是在创建控制器时设置标志,但显然你可以在任何地方设置它们。那么你只需要看一个包含所有旗帜的表达式,然后当它们都评估为真时,你就可以开展业务了。