javascript - 用户界面路由器 : Access route directly using the url

Question

我认为这将是一个非常普遍的问题，但我找不到任何相关信息。我有两种状态，一种是在 /route 上访问，另一种是在 /route/{name} 上访问。如果我使用 ui-sref 调用第二条路线，它工作正常但是当我刷新页面或尝试直接通过 url 访问它时，我进入 /route 页面时甚至很难浏览器中的 url 保持不变。我该如何解决？

  function Routes($stateProvider) {

    $stateProvider.state("route1", {
      url: "/route",
      templateUrl: "js/route/route1.html",
      controller: "Route1Controller",
      controllerAs: "vm",
      resolve: {
        ...
      }
    })
    .state("route2", {
      url: "/route/{name}",
      templateUrl: "js/route/route2.html",
      controller: "Route2Controller",
      controllerAs: "vm",
      resolve: {
        ...
      }
    });
  }

编辑:为了更清楚，我希望 route2 的行为与具有完全不同 url 的任何其他状态一样。如果 url 位于“/route1”和“/route2”，我想没有人会建议嵌套 View 。如果那不可能，我会考虑在 route1 模板中使用嵌套 View 。

Edit2: 问题不在于发布的代码。我有另一条路线“/route/:id”，但我没有定义类型。因此路线实际上是一样的。我定义了类型 ("/route/{id:int}")，现在它可以工作了。

Answer 1

状态定义的顺序在这种情况下决定。 UI-Router 将迭代所有已定义的状态并尝试找到与当前 url 匹配的状态。而第一场比赛将决定一切。

所以我们只需要将第二个声明为第一个:

$stateProvider
// this will be defined as the first 
.state("route2", {
  url: "/route/{name}",
  ...
  }
})
// if no match for /route/param
// this will be used
.state("route1", {
  url: "/route",
  ...
});