使用 Angular ui Router 将对象传递给子 uiView答案

【问题标题】：Pass object to child uiView using Angular's uiRouter使用 Angular ui Router 将对象传递给子 uiView
【发布时间】：2015-08-26 22:24:47
【问题描述】：

我有一个 Angular 应用程序，我在其中使用 uiRouter 单独视图为页面创建标题：

路线配置：

$stateProvider.state('content', {
    url: '/content/{idContent}',
    views: {
        'header@content': {
            templateUrl: 'templates/content/header.partial.html'
        },
        'mainContent': {
            templateUrl: 'templates/content/index.html'
        }
    }
});

内容模板：

<section ng-controller="ContentController">
    <div ui-view="header"></div>
    {{Here I display the content}}
</section>

页眉模板：

<section ng-controller="ContentHeaderController">
    {{Here I render the header}}
</section>

问题是，我需要访问在ContentHeaderController 上的ContentController 中解析的对象。我看到他们不共享父范围：

内容控制器：4

ContentController 的父级：3

ContentHeaderController: 6

ContentHeaderController 的父级：5

如何将对象从内容视图传递到其标题？

【问题讨论】：

标签： angularjs angular-ui-router

【解决方案1】：

控制器之间共享数据的问题可以通过使用事件（不推荐）和使用服务作为模型来解决，这是一种推荐的方式，因为你的数据会自动同步，你不会使用即将被弃用的 API，例如 $broadcast。

这种方法的要点是将服务中的数据存储在对象中，而不仅仅是作为服务本身的简单原语，然后将对此对象的引用传递到控制器中，并将它们绑定在模板中。检查这个blog post关于带有代码示例的模型模式。

【讨论】：