我对Angular很新,我正在尝试构建一个应用程序。
我使用ng-include
插入我的视图,具体取决于我的主控制器的currentURL
变量。
当我尝试通过 ng-included 文件中的$parent
访问主控制器时,我得到的只是undefined
。
我的目标是更改currentURL
变量以更新视图。
这是我的代码:
的index.html
<body ng-controller="mainCtrl as main">
currentURL : {{main.currentURL}}
<div ng-include="main.currentURL"></div>
<script src="/vendors/angular.min.js"></script>
<script src="/modules/login.js"></script>
<script src="app.js"></script>
</body>
app.js
angular
.module('mcaApp', ['login'])
.controller('mainCtrl', mainCtrl);
function mainCtrl() {
var vm = this,
baseURL = 'views/';
vm.currentURL = baseURL + 'login.html';
}
视图/ login.html的
<div ng-controller="loginCtrl as login">
<h1>LOGIN</h1>
</div>
模块/ login.js
angular
.module('login', [])
.controller('loginCtrl', loginCtrl);
function loginCtrl() {
var vm = this;
console.log(vm.$parent); // undefined
}
答案 0 :(得分:3)
如果您想访问位于mainCtrl
控制器内的loginCtrl
,则需要使用$parent
来访问父控制器范围。
但问题是你正在使用loginCtrl
加载ng-include
控制器视图,因此你的控制器被加载到mainCtrl
的子范围内,因为ng-include
创建了一个子范围从目前的范围。
因此,您需要使用$parent.$parent
从mainCtrl
loginCtrl
范围
<强>代码强>
function loginCtrl($scope) {
var vm = this;
console.log($scope.$parent.$parent); // this would contain mainCtrl
}
更好的方法是在定义对象时使用controllerAs语法或遵循点规则,以便遵循原型继承。