angularjs - Angular UI 路由器 - 强制 URL 参数？

Question

我有几个状态使用相同的 Controller 。其中一些不需要 URL 参数，而另一些则需要。如果未提供 URL 参数，如何避免状态可访问？

例子:

我有 2 个 View 或状态，列表和单个。他们都共享同一个 Controller 。我的路线映射如下:

state: app.list
url: /list
controller: appCtrl

state: app.single
url: /single/:id
controller: appCtrl

现在，我要 single仅在指定 id 时才能访问，否则重定向到其他页面。使用相同的 Controller 怎么可能？

Answer 1

方法一

您可以使用 $urlRouterProvider与 when()用于重定向。

app.config(function($urlRouterProvider){
    // when there is an single route without param, redirect to /list
      $urlRouterProvider.when('/single/:id', ['$match', '$state', function($match, $state) {
          if($match.id === ""){
             $state.transitionTo("app.list");
          }
       }
      ]);
});

工作演示: http://plnkr.co/edit/sEoUGGCEge0XbKp3nQnc?p=preview

方法二

您可以查看 param在 controller侧并将其重定向到特定页面

myApp.controller('MainCtrl', function($state, $stateParams) {
  if($state.current.name == 'app.single' && $stateParams.id === ""){
    $state.transitionTo("app.list");
  }
});

工作演示: http://plnkr.co/edit/QNF1RHy4Prde4CRhNLFa?p=preview

注:在上面的演示中，当您当前的状态不应该是 app.single 时，重定向会起作用。 .意味着，如果你在 app.single 状态不会改变状态并尝试不带参数。所以去 main页面，然后点击链接 without param of single state .它将重定向到 list状态。