$state.go 使用 URL 参数声明

Question

我有一个带有 url 参数的状态。类似于：

.state('MyState', {
    url: '/contacts/{personName}',
    templateUrl: '/app/templates/contacts.html',
    controller: 'ContactsController',
    params: {
        personName: null
    }
})

现在，我想使用 $state.go 语法并能够将 personName 参数传递给带有参数的 url。

例如，如果我调用：

$state.go('MyState', {personName: 'john'});

地址栏会显示：http://localhost:8080/#!/contacts/john

现在地址栏显示 http://localhost:8080/#!/contacts/，我不知道如何强制 url 包含 personName。除此之外它工作正常。

Answer 1

在您的状态定义中，当您定义 "params" 时，您不必在 url 中添加参数，因此替换：

url: '/contacts/{personName}',

和

url: '/contacts',

Answer 2

定义状态时使用以下语法

.state('myState', {
        url: '/contacts/:personName',
        templateUrl: '/app/templates/contacts.html',
        controller: 'ContactsController',
          params: {
            personName: {
              array: false
            }
          }
      })

注："Person Name be visible in url"

参考：https://ui-router.github.io/ng1/tutorial/helloworld

Answer 3

只需在状态定义中添加具有默认值的参数。您的州仍然可以有一个 Url 值。

   $stateProvider.state('MyState', {
        url : '/url',
        templateUrl : "/app/templates/contacts.html",
        controller : 'ContactsController',
        params: {personName: 'defaultName'}
    });

并将参数添加到 $state.go() 并导航

$state.go('MyState',{personName: "MIT"});

参考这个：$state.go() with Parameter

希望对您有所帮助..！

$state.go 使用 URL 参数声明

$state.go to state with URL parameter

angularjs

angular-ui-router