Question

我有以下状态，我想映射到相同的路线，然后有一个参数。

/en/live/
/en/


/en/live/football
/en/football

基本上，＆＃39;直播＆＃39;部分需要存储在某种变量中。我尝试过类似的事情：

$stateProvider.state('language.live-lobby', {
    url: "/en/{liveStatus:live|}/football"
}

但是，它不允许您指定空参数。基本上，在上述状态下，/en/live/football匹配而/en/football不匹配。如果有效，我可以阅读liveStatus参数。

是否有可能，而不必定义多个状态？我希望避免创建多个状态，因为它们都共享相同的信息，例如views，data＆amp; resolve？

Answer 1

有a working plunker

基于以下内容：

我们可以使用这种状态def：

.state('language.live-lobby', {
  templateUrl: 'tpl.html',
  //url: "/en/{liveStatus:live|}/football",
  url: "/{lang:(?:en|cz|de)}" +
       "/{liveStatus:(?:live|podcast)}" +
       "/{sport:(?:football|golf)}",
  params: {
    lang:       { squash: true, value: 'en' },
    liveStatus: { squash: true, value: 'live' },
    sport:      { squash: true, value: 'football' },
  }
})

所有这些链接都可以按预期工作：

  // these follow defaults
  <a href="#/en/live/">
  <a href="#/en/">
  <a href="#/en/live/football">
  <a href="#/en/football">

  //here we pass some non default
  <a href="#/cz/podcast/">
  <a href="#/cz/">
  <a href="#/cz/podcast/golf">
  <a href="#/cz/golf">

检查it here

基于可选参数（angular-ui-router）将类似的URL映射到相同的状态

1 个答案: