在ng-click中傳遞html元素信息（AngularJS）

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（或模板或指令）。