这是这个问题的后续内容。我有相同的设置:
Angular scope is shared for all modules and controllers
所以根模块,控制器和指令。现在回答问题:
我有一个服务,里面写着:
firstModule.factory("firstService", function () {
return {
$('.mainitems').click(function () {
alert("hi")
});
};
});
一个嵌套在其他指令中的指令:
secondModule.directive("secondDirective", function () {
return {
templateUrl: "./myurl",
restrict: "E",
replace: true,
compile: function (tElement, tAttrs, controller) {
return {
}
}
}
});
当我有一行:restrict: "E"
时,点击功能不起作用,但是当我删除它时,它就会起作用。
知道为什么这可能是问题吗?这是一件奇怪的事情,经过一天的调试我发现了这个问题。
答案 0 :(得分:2)
事实上,在工厂管理dom操作是一种糟糕的模式!所有DOM操作都必须放在指令中,以便点击它ng-click
例如:
<div ng-controller="MyController">
<div ng-click="click()"></div>
</div>
click()是范围的函数。所以你有这样的控制器:
secondModule.controller('MyController', function($scope){
$scope.click = function(){
//do what you want
};
});
当你点击你的div时,它会调用你控制器中的点击功能
你的指示应该是:
secondModule.directive("secondDirective", function () {
return {
template: "<div ng-click='click()'><a>Click here</a></div>",
restrict: "E",
replace: true,
link: function (tElement, tAttrs, controller) {
}
}
});
你喜欢这样:
<second-directive></second-directive>
答案 1 :(得分:1)
当您提供restrict: "E"
(元素)作为配置选项ng
时,您需要应用此指令的自定义标记:<second-directive></second-directive>
。
删除它时,它默认为"A"
(属性),这可能是您用作声明来应用此指令的内容。