如何将当前 url 与 ui-router 状态 url 匹配

Question

我需要检查我当前的 URL 是否与状态 URL 匹配（使用 ui-router）。这里的问题是我正在动态加载我的所有状态，因此当用户刷新页面时，此 URL 尚未加载，因此我被重定向到其他 URL。

我打算在 otherwise 函数中加载我的所有状态，并用我当前的 URL 检查数学并立即加载它，所以也许以这种方式我赢了'不会被重定向到我的default URL。

示例：
我当前的网址：asd/5/it-is-a-slug
我的州网址：/asd/:id/:slug

有什么想法吗？

Answer 1

我想说的方法是使用内置的 UI-Router $urlRouterProvider.deferIntercept(defer) 为此。检查其他一些：

• can we add dynamic states to $stateprovider with already existing states in ui-router angular.js
• AngularJS - UI-router - How to configure dynamic views
• Angular - Dynamically Choose Starting State

重点是

$urlRouterProvider.deferIntercept(defer)

禁用（或启用）延迟位置更改拦截。

如果您希望自定义同步 URL 的行为（例如，如果您希望推迟转换但保留当前 URL），请在配置时调用此方法。然后，在运行时，在您配置好自己的 $locationChangeSuccess 事件处理程序后调用 $urlRouter.listen()。

有a working example

在 config() 阶段，我们将推迟执行：

app.config(function ($locationProvider, $urlRouterProvider, $stateProvider) {
  
    $urlRouterProvider.deferIntercept();
    ...

在 .run() 阶段，我们将加载动态内容：

$http
  .get("myJson.json")
  .success(function(data)
  {
    angular.forEach(data, function (value, key) 
    { 
      var state = {
        "url": value.url,
        "parent" : value.parent,
        "abstract": value.abstract,
        "views": {}
      };
      
      angular.forEach(value.views, function (view) 
      {
        state.views[view.name] = {
          templateUrl : view.templateUrl,
        };
      });

      $stateProviderRef.state(value.name, state);
    });
    // Configures $urlRouter's listener *after* your custom listener
    
    $urlRouter.sync();
    $urlRouter.listen();
  });

例如in action