其他在StateProvider上

Question

使用angular-ui-router，如何使用otherwise method$stateProvider或者我怎样才能使用它？

Answer 1

您只能使用$stateProvider。

你需要注入$urlRouterProvider，并创建类似代码：

$urlRouterProvider.otherwise('/otherwise'); 

的/otherwise url必须的状态像往常一样被定义为：

$stateProvider 
    .state("otherwise", { url : '/otherwise'...}) 

看到这个链接，ksperling explains

Answer 2

好的，当你意识到你问的问题已经在示例代码的第一行中得到了回答的时候，这个愚蠢的时刻！看看示例代码。

 angular.module('sample', ['ui.compat']) 
     .config(
     [  '$stateProvider', '$routeProvider', '$urlRouterProvider', 
     function ($stateProvider, $routeProvider, $urlRouterProvider) { 
      $urlRouterProvider 
      .when('/c?id', '/contacts/:id') 
      .otherwise('/'); // <-- This is what I was looking for ! 


      .... 

Take a look here.

Answer 3

您可以使用$stateProvider的捕获所有的语法（"*path"）。你只需要在列表的底部添加的状态配置类似以下：

$stateProvider.state("otherwise", { 
    url: "*path", 
    templateUrl: "views/error-not-found.html" 
}); 

所有的选项都在https://github.com/angular-ui/ui-router/wiki/URL-Routing#regex-parameters解释。

与$urlRouterProvider.otherwise(...)相比，此选项的好处在于您不必强制改变位置。

Answer 4

您也可以手动将$ state插入到其他函数中，然后您可以导航到非url状态。这有利于浏览器不更改地址栏，这有助于处理回到上一页。

$urlRouterProvider.otherwise(function ($injector, $location) { 
     var $state = $injector.get('$state'); 

     $state.go('defaultLayout.error', { 
      title: "Page not found", 
      message: 'Could not find a state associated with url "'+$location.$$url+'"' 
     }); 
    }); 

Answer 5

的accepted answer引用angular-route询问ui-router。该接受的答案使用"monolithic"$routeProvider，这就要求ngRoute模块（而ui-router需要ui.router模块）

的highest-rated answer使用$stateProvider代替，并说像.state("otherwise", { url : '/otherwise'... })， 但我找不到任何提及“否则”在documentation it links。但是，我看到它说，$stateProvider提到in this answer：

你不仅可以使用$stateProvider。您需要注入$urlRouterProvider

这就是我的答案可能对您有帮助的地方。对我来说，这是足够使用$urlRouterProvider就像这样：

my_module 
    .config([ 
    , '$urlRouterProvider' 
    , function(
     , $urlRouterProvider){ 
      //When the url is empty; i.e. what I consider to be "the default" 
      //Then send the user to whatever state is served at the URL '/starting' 
      //(It could say '/default' or any other path you want) 
      $urlRouterProvider 
        .when('', '/starting'); 
        //... 
    }]); 

我的建议是与ui-routerdocumentation，（this specific revision），它包括一个类似用途的一致。when(...)方法（第一次调用函数）：

app.config(function($urlRouterProvider){ 
    // when there is an empty route, redirect to /index 
    $urlRouterProvider.when('', '/index'); 

    // You can also use regex for the match parameter 
    $urlRouterProvider.when(/aspx/i, '/index'); 
})