嵌套视图控制器和 ng-click - AngularJs
Nested view controller and ng-click - AngularJs
我有 8 个 jade
视图,当时只有其中一个被加载并被 jquery
填充到一个 div
中,其中有一个 controller
。
现在,我有两个问题:
- 是否有必要在我的部分视图之上再次定义
controller
(与主 controller
相同 controller
)?
- 所有这些视图都具有相同的
ng-click
。但加载后它们不起作用。然而,它们通过 jquery 单击事件工作。我应该对它们做任何额外的事情吗?
我之前在 li
元素上遇到过同样的问题,但我通过使用 compileData 从 ng-click not working from dynamically generated HTML 获得帮助解决了这个问题,但我无法通过按钮获得结果。
代码:
主玉:
div(ng-controller="elementCtrl")
div#ddd(class="col-lg-7 col-md-5 col-sm-7")
局部视图示例:
div#spPartial()
div.col-lg-12.col-md-12.col-sm-12
span.col-lg-2.col-md-5.col-sm-5 Name
input#EnglishName(name="name" type="text" ng-model="elementModel.Name" value="#{Name}" class="col-lg-5 col-md-7 col-sm-5")
button(type="button" compile-Data name="btnSaveElement" ng-click="saveElement()") Save
控制器主要部分:
//It loads the partial view - It works successfully
$http.post('/api/elements/getElementTypesPartial',
{
"ElementId": elementId,
"ProgramId": newVal,
"ElementTypeId": elementTypeId
})
.success(function (d2) {
$("#ddd").html(d2);
}
//It doesn't work at all
$scope.saveElement = function () {
alert();
alert($scope.elementId);
}
另外一件事是我将 $scope.saveElement
放在控制器作用域的根目录中。我不知道 angularJs 如何管理 $scope,所以我在客户端代码中看到 $scope.elementId
。是正确的还是我应该在每次加载该部分时重新生成它($scope.saveElement
)?
抱歉,我找不到任何描述这些内容的参考资料...
您应该摆脱 jQuery 加载并使用 angular 路由器,它将根据路由配置加载模板。
由于它们是由 angular 加载的,它会为您完成所有编译工作。
路由器负责 ajax 以自动获取模板。
控制器也在路由配置中定义,因此您可以从模板中删除 ng-controller
转换不会花很长时间,因为设置路由配置很容易开始
这将解决 ng-click
问题
我有 8 个 jade
视图,当时只有其中一个被加载并被 jquery
填充到一个 div
中,其中有一个 controller
。
现在,我有两个问题:
- 是否有必要在我的部分视图之上再次定义
controller
(与主controller
相同controller
)? - 所有这些视图都具有相同的
ng-click
。但加载后它们不起作用。然而,它们通过 jquery 单击事件工作。我应该对它们做任何额外的事情吗?
我之前在 li
元素上遇到过同样的问题,但我通过使用 compileData 从 ng-click not working from dynamically generated HTML 获得帮助解决了这个问题,但我无法通过按钮获得结果。
代码:
主玉:
div(ng-controller="elementCtrl")
div#ddd(class="col-lg-7 col-md-5 col-sm-7")
局部视图示例:
div#spPartial()
div.col-lg-12.col-md-12.col-sm-12
span.col-lg-2.col-md-5.col-sm-5 Name
input#EnglishName(name="name" type="text" ng-model="elementModel.Name" value="#{Name}" class="col-lg-5 col-md-7 col-sm-5")
button(type="button" compile-Data name="btnSaveElement" ng-click="saveElement()") Save
控制器主要部分:
//It loads the partial view - It works successfully
$http.post('/api/elements/getElementTypesPartial',
{
"ElementId": elementId,
"ProgramId": newVal,
"ElementTypeId": elementTypeId
})
.success(function (d2) {
$("#ddd").html(d2);
}
//It doesn't work at all
$scope.saveElement = function () {
alert();
alert($scope.elementId);
}
另外一件事是我将 $scope.saveElement
放在控制器作用域的根目录中。我不知道 angularJs 如何管理 $scope,所以我在客户端代码中看到 $scope.elementId
。是正确的还是我应该在每次加载该部分时重新生成它($scope.saveElement
)?
抱歉,我找不到任何描述这些内容的参考资料...
您应该摆脱 jQuery 加载并使用 angular 路由器,它将根据路由配置加载模板。
由于它们是由 angular 加载的,它会为您完成所有编译工作。 路由器负责 ajax 以自动获取模板。
控制器也在路由配置中定义,因此您可以从模板中删除 ng-controller
转换不会花很长时间,因为设置路由配置很容易开始
这将解决 ng-click
问题