9

我正在做一个 Angular 应用程序，其中表格的行每个都有一个按钮，单击这些按钮时，应该为该按钮所在的行打开一个新选项卡。

我需要将参数传递到以这种方式创建的新选项卡中。我已经在状态初始化中声明了参数：

.state('viewlisting', {
   url: "/listings/:id",
   params: {
     'action': '',
   },
   controller: 'ListingsController',
   templateUrl: "partials/listings/view_listing.html"
 });

按钮有这样的东西：

ui-sref='viewlisting({id:"+data+", action:"images"})'

参数被传入，一切都按预期工作。

//URL: /#/listings/42
$state.params.action //returns "images"
$state.params.id //returns "42"

但是添加target="_blank"到<a>标签会导致 $state.params 对象返回以下内容：

//URL: /#/listings/42
$state.params.action //returns ""
$state.params.id //returns "42"

我已经搜索了几个小时，我查看了 ui-router 文档和问题跟踪器，以寻找可以解决我的情况的东西，但我什么也没找到。

target='_blank'状态参数是否未在'edui-sref链接上传递？

4

2 回答 2

6

如果有任何参数应该在当前 SPA 上下文（新窗口、新选项卡）之外可用- 它必须是 url 的一部分。

这将起作用：

.state('viewlisting', {
   // instead of this
   // url: "/listings/:id",
   // this will keep the action in a new window
   url: "/listings/:id?action",
   params: {
     'action': '',
   },
   controller: 'ListingsController',
   templateUrl: "partials/listings/view_listing.html"
 });

有关参数的更多详细信息如何使用 ui-router 中的 ui-sref 将参数传递给控制器

于 2015-10-20T11:13:21.817 回答
0

还有另一种不使用 URL 的方法。您可以使用LocalStorageURL 来代替。

在链接标签上使用ng-click并调用函数。在函数中将参数放入LocalStorage. 然后在app.run使用中$rootScope.$on("$stateChangeStart")检查是否LocalStorage有参数。然后获取并params调用$state。params

//in page controller: 
var openNewTab = function () {                  
                    localStorage.newTab = JSON.stringify({
                        state: "yourState",
                        params: {
                            param1: "someparam1",
                          param2:"someparam2"
                        }
                    });                  
                    window.open(document.location.origin);
                      
                }
 
 //angular app run config: 
angularApp.run(function($state){
if(localStorage.newTab){
   var newTab = JSON.parse(localStorage.newTab);
   localStorage.removeItem("newTab");
   $state.go(newTab.state, newTab.params);
   event.preventDefault();
}
})
<a ng-click="openNewTab()" >open new tab</a>

于 2016-12-21T07:46:53.343 回答