无法从包含 ng 的控制器访问 $parent

Question

我是 Angular 的新手，我正在尝试构建一个应用程序。

我使用 ng-include 插入我的视图，这取决于我的主控制器的 currentURL 变量。当我尝试通过 $parent 从 ng-included 文件访问主控制器时，我得到的只是 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';
}

views/login.html

<div ng-controller="loginCtrl as login">
    <h1>LOGIN</h1>
</div>

modules/login.js

angular
    .module('login', [])
    .controller('loginCtrl', loginCtrl);

function loginCtrl() {
    var vm = this;

    console.log(vm.$parent); // undefined
}

Answer 1

因为你想访问 loginCtrl 控制器中的 mainCtrl 那么你需要使用 $parent 来访问父控制器范围。

但问题是您正在使用 ng-include 加载 loginCtrl 控制器视图，因此您的控制器被加载到 mainCtrl 的子范围内，因为 ng-include 创建当前范围的子范围。

因此，您需要使用 $parent.$parent 从 loginCtrl

访问 mainCtrl 范围

代码

function loginCtrl($scope) {
    var vm = this;

    console.log($scope.$parent.$parent); // this would contain mainCtrl
}

更好的方法是在定义对象时使用 controllerAs 语法或遵循点规则，以便遵循原型继承。

无法从包含 ng 的控制器访问 $parent

Can't access $parent from ng-included controller

angularjs

angularjs-scope

angularjs-ng-include