angularjs – 另一个控制器内的Angular ng-include控制器

发布时间：2020-12-17 08:48:36 所属栏目：安全来源：网络整理

导读：我有一种情况,我有一个Angular控制器,它基本上只是加载html模板取决于点击事件.但是,这些模板由自己的控制器管理.这导致控制器位于原始控制器内部,这似乎是错误的： div ng-controller="WindowCtrl" id="focus-window" button ng-click="openProjects()"Show

我有一种情况,我有一个Angular控制器,它基本上只是加载html模板取决于点击事件.但是,这些模板由自己的控制器管理.这导致控制器位于原始控制器内部,这似乎是错误的：

<div ng-controller="WindowCtrl" id="focus-window">

    <button ng-click="openProjects()">Show Projects</button>
    <button ng-click="openTasks()">Show Tasks</button>
    <div ng-include src="template.url"></div>

</div>

controllers.js

.controller('WindowCtrl',function ($scope) {
    $scope.templates = [
        {
        name: 'tasks',url: 'partials/_tasks.html'},{
        name: 'projects',url: 'partials/_projects.html'}
    ];
    $scope.template = $scope.templates[0];

    $scope.openProjects = function() {
        $scope.template = $scope.templates[1];
    };
    $scope.openTasks = function() {
        $scope.template = $scope.templates[0];
    };
});

_projects.html

<div ng-controller="ProjectsCtrl">
  <h2>My Projects</h2>
  ...            
</div>

_tasks.html

<div ng-controller="TasksCtrl">
  <h2>My Tasks</h2>
  ...            
</div>

我的问题是,在不造成范围冲突的情况下,我尝试做什么的最佳解决方案是什么？

所以,我实际上认为你的方法是正确的.我将其基于 controllers的AngularJS文档(“演示”部分显示了一个简单的嵌套控制器层次结构).

此外,这似乎与form指令的工作方式非常相似.它为表单本身创建了一个范围,为整个表单评估$pristine,$dirty,$valid和$invalid.只有当所有子范围的值都为真时,这些值才为真(换句话说,如果所有输入都返回为$valid,则表单只有$有效).这是通过嵌套的作用域层次结构完成的,因此如果Angular以基本方式执行,那么应用程序可以类似地执行此操作.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!