Angular UI-Router $urlRouterProvider .当我单击 <a ui-sref="..."> 时不起作用

IT技术 javascript angularjs coffeescript angular-ui-router
2021-01-23 03:44:16

我.when('/center', '/center/question')在我的角度网络应用程序中有。

当我'/center'在浏览器中输入时，它会'/center/question'按照我的预期重定向到，但是当我单击 时<a ui-sref="center" href="#/center"></a>，它不会重定向而只会停留在 url 上'/center'。

我的控制台没有错误，我不知道为什么。

我在这里看到一个类似的问题Angular UI-Router $urlRouterProvider .when 不再工作了。我尝试了答案，但它仍然对我不起作用。

这是我的咖啡脚本代码：

whenConfig = ['$urlRouterProvider', ($urlRouterProvider) ->
  # default url config

  $urlRouterProvider
  .otherwise '/center'
  .when '/center', '/center/question'
]

stateConfig = ['$stateProvider', ($stateProvider) ->
  # nested url config

  capitalize = (s)->
    s[0].toUpperCase() + s[1..]

  mainConfig = ({
    name: name
    url: "/#{name}"
    templateUrl: "templates/#{name}.html"
    controller: "#{capitalize name}Ctrl"
  } for name in ['center', 'keywordList', 'keywordConfig', 'log', 'stat'])

  centerConfig = ({
    name: "center.#{name}"
    url: "/#{name}?page"
    templateUrl: "templates/center/#{name}.html"
    controller: "Center#{capitalize name}Ctrl"
  resolve:
    thead: (CenterService) ->
      CenterService.getThead @self.name
    data: (CenterService, $stateParams) ->
      CenterService.fetchItems @self.name, $stateParams.page
  } for name in ['question', 'answer', 'comment', 'article'])

  for singleConfig in mainConfig
    $stateProvider.state singleConfig

  for childConfig in centerConfig
    $stateProvider.state childConfig
]

app.config whenConfig
app.config stateConfig
2个回答

有一个新的工作 plunker （扩展Angular UI-Router $urlRouterProvider .when not working *anymore*），它应该与版本一起使用0.2.13+

以前的解决方案

直到0.2.12-我们可以使用的版本$urlRouterProvider.when()，在文档（小引用）中建议：

如何：设置默认/索引子状态

...
如果您希望 'parent.index' url 为非空，则使用 $urlRouterProvider 在您的 module.config 中设置重定向：

 $urlRouterProvider.when('/home', '/home/index');

所以这是上面提到的问答中显示的解决方案：

var whenConfig = ['$urlRouterProvider', function($urlRouterProvider) {

    $urlRouterProvider
      .when('/app/list', ['$state', 'myService', function ($state, myService) {
            $state.go('app.list.detail', {id: myService.Params.id});
    }])
    .otherwise('/app');
}];
...
app.config(whenConfig)

现在 - 我们不能。

UI-Router "FIX" in 0.2.13

这是由于“FIX” （我只是不确定），在0.2.13版本中提到

错误修复
$state:
- ...
- 避免在.transitionTo ( b267ecd3 , closes #1573 )之后从 url 重新同步

这是在 urlRouter.js 中添加的新代码：

if (lastPushedUrl && $location.url() === lastPushedUrl)
 // this line stops the corrent .when to work
 return lastPushedUrl = undefined;

lastPushedUrl = undefined;

这段代码正在优化/修复一些其他问题......而且，关闭.when()功能

解决方案

如前所述，这个全新的plunker展示了 0.2.13+ 版本的方式。我们只需要监听状态变化，如果状态是“app.list”，我们可以用一些 id 去查看它的详细信息......

var onChangeConfig = ['$rootScope', '$state',
 function ($rootScope, $state) {

  $rootScope.$on('$stateChangeStart', function (event, toState) {    
    if (toState.name === "app.list") { 
      event.preventDefault();
      $state.go('app.list.detail', {id: 2});
    }
  });

}]

在这里检查plunker

你也应该知道，因为我不确定 0.2.13 的这个“新”行为是否正确，我发布了一个问题github.com/angular-ui/ui-router/issues/1584。可能是这种解决方法是可行的，但也可能不是……我们会看到 ;) 祝你好运与出色的 UI-Router ;)
2021-03-17 03:44:16
@ChrisT 是的，我想要“默认子状态”
2021-03-18 03:44:16
知道了 ！其实我也希望这可以更优雅，我订阅了这个问题，谢谢:)
2021-03-23 03:44:16
UI-路由器开发在这里。J22Melody，您的用例是您本质上想要“抽象状态的默认子状态”吗？@RadimKöhler 我正在考虑您的问题。我可能会回滚 0.2.x 的提交（因为这是人们目前所期望的），但是当我们有更好的基于状态的重定向解决方案时，会在以后的版本中重新引入它。
2021-04-13 03:44:16

您也可以在控制器中执行此操作。我认为这比听状态变化更干净。

例子：

.controller 'YourControllerName', ($scope, $state) ->
    $state.go "center.question" if $state.is "center"
这只会在控制器第一次初始化时触发一次，但不会再次触发，因此不能解决问题。有了这个解决方案访问centre会重定向到center.question，但单击ui-sref的center将导航到center无需再次射击上面的代码，让你在一个空白视图。
2021-04-06 03:44:16
我是唯一一个认为 CoffeeScript 完全不可读的人吗？
2021-04-10 03:44:16
其它你可能感兴趣的问题
上一篇javascript中默认函数参数的范围 下一篇通过 new RegExp(myString) 创建的正则表达式不起作用（反斜杠）