从父作用域访问子作用域

Question

我很难弄清楚如何访问子作用域数据。在创建项目时，我使用路由和ui视图来创建流，我有“向导”，它是父状态，还有几个子状态，每个子状态都有不同的控制器。

这是我的"Wizard.html“文件，带有子状态的ui-view。

<div class="header">
    <button ng-click="someFunction()">Back</button>
    <button ng-click="createProject()">Next</button>
</div>

<div class="wizard-children-view" ui-view></div>

<div class="footer">
</div>

以下是路由：

.state('wizard', {
    url: '/wizard',
    abstract: true,
    views: {
        'wizard': {
            templateUrl: 'wizard.html',
            controller: 'WizardController'
        }
    }
})
.state('wizard.project', {
    url: 'project',
    controller: 'ProjectController',
    templateUrl: 'project.html'
})
.state('wizard.aboutus', {
    url: 'aboutus',
    controller: 'AboutUsController',
    templateUrl: 'aboutus.html'
})

在向导的标题(即父级)中，我有一个顶部栏，上面有“后退”和“下一步”操作按钮，它们始终显示在屏幕上。我正在尝试使用这些按钮访问其中一个孩子，并在其中一个孩子中执行一些操作。例如，我想让“下一步”按钮调用一个函数，该函数验证子视图中的一个窗体并创建一个新项目，但问题是带有ng-click="createProject()"的按钮在父范围中，而窗体的所有数据都在子范围中，所以它是未定义的。这是可以做到的吗？

Answer 1

您可以从子控制器使用$emit：

$scope.$emit("foo", {name: "bar"});

现在，在您的父控制器中：

$scope.$on("foo", function(e, data) {
    // data.name == "bar"
});

https://docs.angularjs.org/api/ng/type/$rootScope.Scope