我想拥有一个具有帐户注册,UserProfile类和Identity Role类的UsersAdmin视图.我使用默认的个人认证的MVC5.
我正在使用ui-router进行路由.我已经看到许多使用viewmodel的例子来将多个模型传递给单个cshtml视图.但我需要一个更复杂的设置.我创造了一个我正在寻找的模型.什么是最好的方式来做到这一点.
我正在使用ui-router进行路由.我已经看到许多使用viewmodel的例子来将多个模型传递给单个cshtml视图.但我需要一个更复杂的设置.我创造了一个我正在寻找的模型.什么是最好的方式来做到这一点.
这是我的设置看起来像
UI路由
// Default route
$urlRouterProvider.otherwise('/Document');
// Application Routes States
$stateProvider
.state('app',{
abstract: true,controller: "CoreController",resolve: {
_assets: Route.require('icons','toaster','animate')
}
})
.state('app.document',{
url: '/Document',templateUrl: Route.base('Document/Index'),resolve: {}
})
.state('app.register',{
url: '/Register',templateUrl: Route.base('Account/Register'),resolve: {}
}).state('app.applicationUser',{
url: '/ApplicationUser',templateUrl: Route.base('ApplicationUsers/Index'),resolve: {}
}).state('app.role',{
url: '/Role',templateUrl: Route.base('Role/Index'),resolve: {}
}).state('app.roleCreate',{
url: '/RoleCreate',templateUrl: Route.base('Role/Create'),resolve: {}
}).state('app.userProfile',{
url: '/UserProfile',templateUrl: Route.base('UserProfiles/Index'),resolve: {}
}).state('app.userProfileCreate',{
url: '/UserProfileCreate',templateUrl: Route.base('UserProfiles/Create'),resolve: {}
}).state('app.login',{
url: '/Login',templateUrl: Route.base('Account/Login'),resolve: {}
});
}
_Layout.cshtml
<div ui-view class="app-container" ng-controller="CoreController">@RenderBody()</div>
导航
<li>
<a ui-sref="app.userProfile" title="Layouts" ripple="">
<em class="sidebar-item-icon icon-pie-graph"></em>
<span>User Profile</span>
</a>
</li>
解决方法
ui路由器可以通过使用来帮助您实现这一点
一个.
ui-sref='stateName({param: value,param: value})'
可以使用$stateParams在控制器中访问与状态名一起传递的parameterr对象
湾
在你的控制器你可以做一些类似的事情
if ($stateParams.id != null) {
// service call goes here
}
C.您需要使用命名视图
就像是
$stateProvider
.state('report',{
views: {
'filters': { ... templates and/or controllers ... },'tabledata': {},'graph': {},}
})
哪里
filters
和
tabledate
是命名的观点.
ui-view在这里有一个体面的例子https://github.com/angular-ui/ui-router/wiki/Multiple-Named-Views
Btw,我建议你先弄清楚动态的面板(即由于某种用户交互而变化的面板)与静态面板(一旦加载就不会改变).您只应该查看ui视图来替换动态部分,通过将所有内容放在子视图中,使应用程序变得更加复杂,没有任何意义.各州可能非常混乱非常快.
我使用ng-include指令将静态视图加载到父状态,并且仅为更改的部分视图定义子状态.
<div ng-include="'/MyStaticView'" ng-show="MyCondition == true "></div>
