带有自定义数据的 AngularJS ui-router 视图 [英] AngularJS ui-router views with custom data

问题描述

我有一个 AngularJS 应用程序并使用 ui-router 进行路由.我的一个页面有两个相似的部分，具有相同的模板和逻辑(所以我希望它们可以使用相同的控制器).它们之间的唯一区别是例如 type 属性.这是页面的简化小提琴:http://jsfiddle.net/e_gluhotorenko/XeX59/7/.

那么是否可以为视图的范围提供自定义不同数据?类似于状态中的自定义数据但用于视图:

 视图:{'第1节':{templateUrl: 'section.html',控制器:'ctrl'，数据:{类型:'type1'}},'第2节':{templateUrl: 'section.html',控制器:'ctrl'，数据:{类型:'type2'}}}

或者使用 ui-view 指令，如 ng-inclide 的 onload:

<div ui-view="section2" onload="type = 'type2'"></div>

解决方案

刚发现 ui-view 实际上有 onload 属性，文档中没有，但是是在 API 参考.所以我从问题中得到的例子是有效的！小提琴

I have an AngularJS app and use the ui-router for routing. One of my pages has two similar sections with the same template and logic (so I hope they can use the same controller). The only difference between them is for example type property. Here is simplified fiddle of the page: http://jsfiddle.net/e_gluhotorenko/XeX59/7/.

So Is it possible to provide custom different data to the views's scopes ? Something like custom data in states but for views:

views: {
    'section1' : {
        templateUrl: 'section.html',
        controller : 'ctrl',
        data : { type: 'type1'}
    },
    'section2' : {
        templateUrl: 'section.html',
        controller : 'ctrl',
        data : { type: 'type2'}
    }
}

Or with ui-view directive like in ng-inclide's onload:

<div ui-view="section1" onload="type = 'type1'"></div>
<div ui-view="section2" onload="type = 'type2'"></div>

解决方案

Just found out that ui-view actually has onload attribute, it is absent in documentation but is in API ref. So my example from the question works! fiddle

这篇关于带有自定义数据的 AngularJS ui-router 视图的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！