我有暴露模块模式,看起来像这样:
'use strict';
angular.module('app', [])
.directive('myDirective', ['SomeDep', function (SomeDep) {
var linker = function (scope, element, attr) {
// some work
};
return {
link: linker,
restrict: 'E'
};
}])
;
Run Code Online (Sandbox Code Playgroud)
我遇到的问题是将$ watch集成到这里.通过'$ window'服务专门观看窗口调整大小.
[编辑]:
我一直意识到我的问题是什么......当我忘记我将它作为属性实现时,我正在限制元素... @ _ @;
在过去的 3 天里,我一直在网上搜索,试图找出当 angular 注意到 div 宽度发生变化时如何让指令运行。我一直看到我应该如何实现这一目标的相同示例,但是,它们对我不起作用,我不知道为什么。
我回到了第一广场。我想要做的就是:当 div 的宽度发生变化时,更新 div 的 css 属性(将指令作为属性)。
我需要知道如何获得角度来检查属性何时发生变化。
这是我到目前为止:
.directive('stayPut', function () {
var linker = function (scope, element, attrs) {
scope.getElemWidth = function () {
return element.width();
};
scope.$watch(scope.getElemWidth,
function (newWidth, oldWidth) {
var deltaWidth = newWidth - oldWidth;
console.log(deltaWidth);
element.css('top',
(parseInt(element.css('top')) +
deltaWidth) +
'px');
}, true);
element.bind('resize', function () {
scope.$apply();
});
};
return {
link: linker,
restrict: 'A'
}
});
Run Code Online (Sandbox Code Playgroud)
我知道这里的问题是:
element.bind('resize', function () {
scope.$apply();
});
Run Code Online (Sandbox Code Playgroud)
我对它的工作原理有一个模糊的理解,但我不明白为什么它在这里不起作用。
我创建了一个带有独特边框样式的 div 的自定义按钮。我正在尝试处理“鼠标按下”以切换边框颜色以产生缩进的错觉。然后处理“mouseup”以切换回默认值。
问题是当鼠标离开按钮并且“mouseup”被触发时,它不再由 div 处理。我尝试拦截“mouseleave”,我尝试添加点击时的数据属性(不会更新),我尝试添加一个名为“imclicked”的带有 .addClass 的临时类(无法让它工作) .
我真的很挣扎。
到目前为止,这是我的代码:
function ToggleBorder() {
// Get Border Colours
//-----------------------------------
var top = $(this).css("borderTopColor"),
right = $(this).css("borderRightColor"),
bottom = $(this).css("borderBottomColor"),
left = $(this).css("borderLeftColor");
// Assign new Colours
//-----------------------------------
$(this).css("borderTopColor", bottom);
$(this).css("borderLeftColor", right);
$(this).css("borderBottomColor", top);
$(this).css("borderRightColor", left);
}
$(".main-nav-button").mousedown(ToggleBorder);
$(".main-nav-button").mouseup(ToggleBorder);
$(".main-nav-button").mouseleave(function() {
// test for mousedown
});
Run Code Online (Sandbox Code Playgroud)
我该怎么做才能切换回 mouseleave 的默认边框?