如何使用角度为1.5的组件与UI路由器状态

Question

现在，角度UI路由器项目没有任何关于角度1.5组件的明确说明。 我的项目需求是使用嵌套状态，我想使用角1.5组件轻松迁移到角2.我正在寻找最好的两个样板。 选项1,2 & 4支持以下链接。我想知道什么是嵌套状态的最佳选项，并迁移到角2

Angular 1.5 components with nested states

Answer 1

我只是分享了一个哥们这一解决方案。不确定它是否符合您的确切要求，但使用UI-Router 1.0.0您可以直接路由到组件。为了更进一步，使用嵌套状态，我们可以在命名视图上指定特定组件。然后我们用标记ui-sref链接到我们的孩子状态。当这个状态变得活跃时，其视图的组件也是如此。

如果要使这些视图具有动态性，例如基于用户角色说，那么您可以使用templateProvider函数。但是，对于templateProvider，您不能使用组件来定义视图，因此您可能必须仅返回组件的标记。

例如<editAdminProfileForm></editAdminProfileForm>

更多与templateProvider看到我的其他答案在这里有条件的观点：Angularjs ui-router : conditional nested name views

而且这里的一对UI的路由器一些额外的阅读与组件：
https://ui-router.github.io/guide/ng1/route-to-component
https://ui-router.github.io/docs/latest/interfaces/ng1.ng1statedeclaration.html#component

app.js

... 

.state('app', { 
    abstract: true, 
    templateUrl: 'templates/user-profile.html', 
}) 

.state('app.profile', { 
    url: '/profile', 
    views: { 
    'profile': { 
     component: 'userProfile' 
    } 
    } 

}) 

.state('app.profileEdit', { 
    views: { 
    'editProfile': { 
     component: 'editProfileForm' 
    } 
    } 
}); 

用户profile.html

<ui-view> 
    <div ui-view="profile"></div> 
    <div ui-view="editProfile"></div> 
</ui-view> 

用户轮廓component.js
轮廓编辑component.js

yourApp.component('userProfile', { ... }); 

yourApp.component('editProfileForm', { ... }); 

用户简档组件。 html

<button type="button" ui-sref="app.profileEdit()">Edit Profile</button>