ui-路由器：URL 中未显示参数的默认值

Question

我有一个州是我申请的入口点。但是，入口页面需要日期参数才能显示列表。如果 URL.

中未提供日期，则配置为使用当前日期

从技术上讲，一切正常。默认值传递给控制器，控制器可以使用它来加载一些数据，但它不会在 URL.

中显示日期

这是状态配置：

$stateProvider.state('openJobs', {
      controller: 'openJobsCtrl as openJobs',
      params: {
        shippingDate: {
          value: getFormattedCurrentDate(),
          squash: false
        }
      },
      templateUrl: 'openJobs.html',
      url: '/openJobs/:shippingDate'
    });

我创建了一个工作 plunkr 来演示行为（运行在新的 window 中查看 URL 变化）。如果我创建 ui-sref link 到 openJobs，默认值将显示在 URL 中。但是，如果有人通过输入 http://host.com/openJobs/ 直接打开页面，默认值将在后台使用，但不会显示在 URL.

中

如何实现，无论打开状态如何，默认值都会显示在URL?

Answer 1

您可以使用附加默认日期的 urlRouterProvider 重定向传入路径。 urlRouterProvider 将更新浏览器位置。

    $urlRouterProvider.when("/openJobs/", function() {
        return "/openJobs/" + getFormattedCurrentDate();
    });

如果状态与状态名称匹配（通过 ui-sref 或 $state.go()），浏览器位置将更新为 url 路径。

然而，如果状态与 url 路径匹配，则浏览器位置将不会更新，因为它已经与 url 匹配。这就是为什么您需要在您的案例中使用 $urlRouterProvider 来附加日期。

ui-路由器：URL 中未显示参数的默认值

ui-router: Default value for param not shown in URL

angularjs

angular-ui-router

default-value