angularjs - 默认为 Angular UI-Router 嵌套 View

标签 angularjs angularjs-routing angular-ui-router

当我导航到加载主模板的父状态配置文件时,我试图默认打开状态 'profile.general'

当导航到/profile url 时,如何激活 ui-view 的嵌套状态?

$urlRouterProvider.otherwise("/profile/general");

$stateProvider.state('profile', {
    url: '/profile',
    abtract: true,
    views: {
        "main": {
            controller: 'ProfileCtrl',
            templateUrl: 'src/app/profile/index.tpl.html'
        }
    }
}).state('profile.general', {
    //url: '/register/details',
    templateUrl: 'src/app/profile/profile-general.html'
    //controller: 'ProfileCtrl'
}).state('profile.security', {
    //url: '/register/details',
    templateUrl: 'src/app/profile/profile-security.html'
}).state('profile.social', {
    //url: '/register/details',
    templateUrl: 'src/app/profile/profile-social.html'
}).state('profile.privacy', {
    //url: '/register/details',
    templateUrl: 'src/app/profile/profile-privacy.html'
}).state('profile.payments', {
    //url: '/register/details',
    templateUrl: 'src/app/profile/profile-payments.html'
}).state('profile.restrictions', {
    //url: '/register/details',
    templateUrl: 'src/app/profile/profile-restrictions.html'
});
})

HTML

<div id="profile-views" ui-view></div>

最佳答案

a working plunker

这些行应该有帮助:

$urlRouterProvider.when("/profile", "/profile/general");
$urlRouterProvider.otherwise("/profile/general");

我们应该给一般子状态url:

.state('profile.general', {
    //url: '/register/details',
    url: '/general',
    templateUrl: 'src/app/profile/profile-general.html'

因此,有了这些,我们就有了 .when 重定向...只要用户只针对抽象状态 - 就会重定向到选定的 url。

此外,因为我们为 child 引入了 url,所以我们可以使用 .otherwise 作为整体默认状态。

另一种方法是省略一个 child 的 url (恰好是一个 child ):

How to: Set up a default/index child state

查一下here

关于angularjs - 默认为 Angular UI-Router 嵌套 View ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31769475/

相关文章:

javascript - 具有动态 URL 的 Angular UI 路由器

javascript - 如何使用 ng-repeat 将对象数据传递到表

javascript - AngularJS uibModal 可重用函数

javascript - 从 Controller 内部 Angular 滚动到元素

javascript - 清除所有挂起的 $http 请求并在 angularjs 中重新加载页面

angularjs - 将url id重命名为angularjs中可读的格式

asp.net-mvc - 站点托管到 IIS 后,AngularJS 路由不起作用

angularjs - 我想从 ng repeat ui-route 中删除 td

javascript - Angular 清理的目的是什么?

angular - 如何使用 Angular 2 在 sitemap.xml 中创建动态 URL?