javascript - 如何使用 ui-router 将子或孙状态设置为默认索引状态？

Question

我正在使用带有 ui-router 的角度。我想做的是当用户浏览到以下链接时：

/
/contacts
/contacts/:id

它们都默认显示与带有默认 :id 的链接/contacts/:id相同的内容，并且 url 保持不变（不会更改为/contacts/:id）。

ui-router wiki 上有一个关于此的常见问题解答，但它没有演示如何使用孙子甚至更深的后代状态进行初始化。

如何：设置默认/索引子状态

我尝试了几种不同的状态设置，但均无济于事。我做错了吗？这是示例页面：

ui-路由器测试

Answer 1

用 .when() 解决了这个问题。示例： ui-router-test。

$urlRouterProvider
    .when('/', ['$state', function ($state) {
        $state.transitionTo('contacts.detail', {contactId: 1}, {location: false});
    }])
    .when('/contacts', ['$state', function ($state) {
        $state.transitionTo('contacts.detail', {contactId: 1}, {location: false});
    }])
    .otherwise('/');

$stateProvider
.state("home", {
    url: "/"
})
.state('contacts', {
    url: '/contacts',
    template: 'Contacts: <div ui-view></div>'
})
.state('contacts.detail', {
    url: '/:contactId',
    template: '<p class="lead">Contact ID is {{$stateParams.contactId}}</p>'
});