【发布时间】:2013-03-31 00:37:25
【问题描述】:
我有一个在我的 DOM 中多次追加的模板。
<div ng-controller="theController">
content does not matter
</div>
所以控制器被实例化了很多次。 这是一个问题,因为如果我在控制器中放置一个观察者
theController = function($scope) {
$scope.$on('myVar', function() {
// run one time for each time the template is repeated
})
}
关于如何避免这种情况的任何想法? 提前致谢。
更新
好的,我会尽量说清楚。
也许我有一个表单,它是根据异步请求的响应动态构建的。
<form ng-controller="formController">
<div ng-repeat="f in fields">
<ng-inclide src="f.fields"></ng-include>
</div>
</form>
控制器类似于:
function formController($scope) {
$scope.fields = [{ template:'', ... }];
// data come from an ajax request...
// here are static for the sake of simplicity.
}
所以我不知道表单中会附加哪些字段。
表单字段结构存储在 html 部分中...类似于:
<div ng-controller="inputController">
<label> .... </label>
<input type="text" .... />
</div>
或
<div ng-controller="selectController">
<label> .... </label>
<select>
....
</select>
</div>
function selectController($scope){
$scope.$on("myCustomEvent", function(event) {
cionsole.info("Options were updated");
});
}
当表单有多个input type=text 或select 时,inputController 或selectController 会被多次实例化。
为什么不希望每个实例都发生 $watch?
当特定事件发生时,我想更新页面中选择之一的选项。
我得到的是更新页面中的所有选择。
从评论中,我了解到在同一页面中拥有更多具有相同控制器的元素是错误的。 所以在我看来,目前唯一可用的解决方案是避免为表单的每个元素定义一个控制器,对吧?
更新 2
$emit在inputController中使用:
function inputController() {
$scope.fireclick = function(p) {
if (p == 'specificInput') {
/* this is a temporary work around
I used to bind the event only with a specific field */
$scope.$emit("myCustomEvent");
}
}
}
这是html部分中使用的输入字段的完整代码:
<input type="text" ng-click="fireclick(f.name);" name="{{f.name}}" />
@任何人:
至少可以确认(并最终说明原因)在同一个页面上使用同一个控制器有更多元素是错误的
【问题讨论】:
-
控制器实例不能(也不应该)在多个元素之间共享。你想做什么?为什么你不希望
$watch出现在每个实例上?控制器本质上是您在 DOM 中使用它们的地方的本地 - 它们不是应用程序范围的 - 所以如果多次触发$watch是一个问题,那么您可能做错了什么。 -
是广播/发射事件
-
@ArunPJohny 我使用了 $rootScope.$emit('myCustomEvent')
-
谁在触发这个事件,是在表单中还是从其他地方
-
你能分享触发事件的代码吗
标签: javascript templates model-view-controller controller angularjs