Question

我正在尝试创建一个包含3个链接的导航栏我想在没有点击page.1 ui-sref的情况下第一次获得page.1，我喜欢html：

  <nav>
        <a ui-sref="page.1">Search</a>
        <a ui-sref="page.2">Results</a>
        <a ui-sref="page.3">Detail</a>
      </nav>
     <ui-view></ui-view>

我的州定义如下：

angular.module('scrollDemo', ['ui.router'])
.config(function($stateProvider) {
  $stateProvider
    .state('page.1', {
      url: '/page1',
      templateUrl: '/Page1.html'
    })
    .state('page.2', {
      url: '/page2',
      templateUrl: '/Page2.html'
    })
    .state('page.3', {
      url: '/page3',
      templateUrl: '/Page3.html'
    });
})

我该如何处理？

Answer 1

您可以使用$urlRouterProvider.otherwise('/path');来设置详细信息路径。

angular.module('scrollDemo', ['ui.router'])
.config(function($stateProvider,$urlRouterProvider) {

  $urlRouterProvider.otherwise('/page.1');

  $stateProvider
    .state('page.1', {
      url: '/page1',
      templateUrl: '/Page1.html'
    })
    .state('page.2', {
      url: '/page2',
      templateUrl: '/Page2.html'
    })
    .state('page.3', {
      url: '/page3',
      templateUrl: '/Page3.html'
    });
})

Answer 2

您似乎希望在加载应用程序时立即转到/page.1，您可以执行以下操作：

angular.module('scrollDemo', ['ui.router'])
.run(function($location) {
    $location.path('/page1');
});

这将在加载完所有内容后立即自动将应用程序的路径更改为所需的路径。

自动加载视图而不用ui-view angularjs单击href

2 个答案: