将参数传递给 Angular UI 路由器模板

Jan*_*nne 0 javascript angularjs angular-template angular-ui-router es6-class

我的 angular ui 路由器将状态/视图更改为:

    $stateProvider
        .state({
            name: 'home',
            url: '/',
            template: '<home-view></home-view>',
        })
Run Code Online (Sandbox Code Playgroud)

有没有办法将绑定参数传递给 UI 路由器中的 < home-view > ?

例如

<home-view my-data="dataObject">
Run Code Online (Sandbox Code Playgroud)

或者

<home-view my-data="myService.getMyData()">
Run Code Online (Sandbox Code Playgroud)

my-view 的控制器位于包含实际模板和指令的自己的文件中。

Jan*_*nne 5

最后我的同事帮助解决了这个问题。解决方案使用解析来获取数据,然后将其作为路由器范围变量传递给模板。重要的学习是在路由器中定义的控制器有它自己的范围,而不是“主视图”的范围。在我的家庭控制器中,路由器控制器可以通过 $scope.parent 访问。

.state({
    name: 'home',
    url: '/',
    resolve: {
        cData: (MyService) => {
            return MyService.getMyData()
        }
    },
    controller: function (cData) {
        this.data = cData;
    },
    controllerAs: 'ctrl',
    template: '<home-view my-data="ctrl.data"></home-view>'
})
Run Code Online (Sandbox Code Playgroud)