Question

我试图让用户点击“在新标签页中打开”链接，这实际上会将HTML元素推送到新窗口中。我不知道该怎么做。

现在，我可以打开一个名为newTab.html的新通用窗口。

<div ng-repeat="api in apiList[0].accounts">
   <div class="panel panel-info" id="panel1">
      <div class="panel-heading">
         <h4 class="panel-title">
            <a data-toggle="collapse" data-target="#collapseAccountsV{{$index}}" class="collapsed">
            {{api.uri}}
            </a>
            <i class="newTab" ng-click="apiTab()">(Open in new tab)</i>
         </h4>
      </div>
      <div id="collapseAccountsV{{$index}}" class="panel-collapse collapse">
         <div class="panel-body">
            <table class="table">
               <tr ng-repeat="method in api.methods">
                  <td>{{method.name}}</td>
                  <td>{{method.desc}}</td>
               </tr>
            </table>
         </div>
      </div>
   </div>
</div>

使用ng-click我调用了apiTab()。

 $scope.apiTab = function() {
        sessionStorage["apiData"] = "hello";
        window.open("newTab.html")
  };

和newTab.html就在下面。

<script>
   var myVars = sessionStorage["apiData"];
   alert(myVars);
</script>

是否有一种简单的方法可以传递，或者将<div id="collapseAccountsV{{$index}}"推送到我的通用窗口并保持其格式（在table布局内）？

Answer 1

是的，您可以在窗口之间进行通信。

Window.postMessage会让您将邮件发送到其他窗口。在第二个窗口中，您需要添加一个事件侦听器来接收消息（例如，在上一个链接中。）。

您不仅要传递标记，还要传递角度渲染的对象，以便您可以在新页面上重新渲染它。如果要让它重新渲染，您还需要在新页面中包含角度。我假设您希望用户能够访问某些功能，因此有角度可以使这更容易。

在ng-click中，您可以传入参数。

 <i ng-click='apiTab(api)'>...</i>

我建议您在要传入的apiTab函数中检索div（或模板或指令）。

在ng-click中传递html元素信息（AngularJS）

1 个答案: