我正在创建一个指令，将中心一个div。
到目前为止，我有这个代码：
app.directive("setcenter",function () {
return {
scope:{
setcenter: '='
},link: function (scope,element,attrs) {
scope.$watch('setcenter',function (newValue) {
if (newValue == true) {
var width = element.width();
element.css('position','absolute');
element.css('top','80px');
element.css('left','50%');
element.css('z-index','200');
element.css('margin-left','-' + width / 2 + 'px');
}
});
}
}
});
问题是元素的宽度。这个指令的整个要点是使用这个指令的div，没有设置宽度。我想要这个指令找出宽度和中心的div。
我遇到的问题是，当指令被调用时，div的实际宽度尚未知道。当我使用这个在我的情况，div是800px，但当页面完成加载时，div是221px。
那么，我可以做什么等待，直到实际的宽度是知道的div？
首先，我只使用这个逻辑，当我为一个指令而不是链接功能定义一个控制器。所以在链接功能中定义它可能会导致不同的行为，但我建议你首先尝试它，如果你不能得到它的工作，然后切换到使用控制器。
据我所知，你需要做这个工作的唯一变化是将$ scope更改为scope调用，$ element更改为element，因为依赖注入的对象成为标准链接函数参数。
$scope.getElementDimensions = function () {
return { 'h': $element.height(),'w': $element.width() };
};
$scope.$watch($scope.getElementDimensions,function (newValue,oldValue) {
//<<perform your logic here using newValue.w and set your variables on the scope>>
},true);
$element.bind('resize',function () {
$scope.$apply();
});
