如何在不出现在 URL 中的情况下将参数传递给 Angularjs 的 router-ui？

Question

我有一个 AngularJS 应用程序，它使用 ui-router 来管理我的应用程序的状态和 URL 路由。

这是一个示例状态：

.state('my_state', {
    url: '/my_state/:arg1',
    templateUrl: 'http://www.example.com/html/my_file.html',
    controller: 'MyCtrl'
})

这是它的控制器：

app.controller('MyCtrl', function($stateParams) {
    console.log('arg1 = ', $stateParams.arg1)     
);

以下是我如何从另一个控制器中将人员发送给它：

$state.go('my_state', {'arg1': 'hello'});

当执行上面的 $state.go 行时，我被发送到这个 URL /my_state/hello 并且我看到以下打印到浏览器的调试 window:

arg1 = hello

现在这是我的问题：我可以向该控制器添加另一个参数，以便：

它被命名为arg2。
可选。
若提供，可在MyCtrl内访问。
它没有出现在 URL 中。

如果是，请告诉我怎么做。

Answer 1

.state('someState', {
            url: '/my_state?arg1',
            templateUrl: 'http://www.example.com/html/my_file.html', // I assume this is correct for the way you set it up.
            controller: 'MyCtrl',
            params: { // This is the part you'll add
                arg2: {
                    value: null, // you can set a default value
                    squash: true
                }
            }
})

这应该可以解决您的问题！我已经用了很多次了！很有用。

Answer 2

试试这个：

.state('my_state', {
    url: '/my_state',
    templateUrl: 'http://www.example.com/html/my_file.html',
    controller: 'MyCtrl',
    params: null
})

Answer 3

UI路由器中的路由参数默认是可选的。例如你的代码（以下）说arg1是一个可选参数。所以 /my_state/:arg1 和 /my_state/ 都可以，但 /my_state 不行（没有尾部斜杠）。它还显示 URL.

中的 arg1 值

.state('my_state', {
    url: '/my_state/:arg1',
    templateUrl: 'http://www.example.com/html/my_file.html',
    controller: 'MyCtrl'
})

您可以根据自己的喜好向此控制器添加另一个可选参数：

.state('my_state', {
    url: '/my_state/:arg1',
    templateUrl: 'http://www.example.com/html/my_file.html',
    controller: 'MyCtrl',
    params: {
        arg2: { value: null }
    }
})

要隐藏参数，您必须在 params.

中定义它们

请注意， squash 属性（在 params 内）配置默认参数值的表示方式URL 当当前参数值与默认值相同时。如果未设置压缩，则使用配置的默认压缩策略。

Working Plunker

更新

另一个 Working Plunker 在控制器内部使用 $state.go('my_state', {'arg1': 'hello', 'arg2': 'world'});。

请注意 对于Activating a state，ui-sref和$state.go在功能上没有区别

Answer 4

Using Parameters without Specifying Them in State URLs

您仍然可以指定要接收的参数，即使这些参数没有出现在 url 中。您需要在状态中添加一个新字段参数并创建 links，如在链接中使用参数

中指定的那样

比如你有状态

.state('contacts', {
        url: "/contacts",
        params: {
            param1: null
        },
        templateUrl: 'contacts.html'
    })

您创建的link是

<a ui-sref="contacts({param1: value1})">View Contacts</a>

或者您也可以将它们传递给 $state.go()。

$state.go('contacts', {param1: value1})

如何在不出现在 URL 中的情况下将参数传递给 Angularjs 的 router-ui？

How to pass argument to Angularjs's router-ui without showing up in URL?

angularjs

angular-ui-router