angular：如何通过渲染组件在新选项卡中显示数据

问题描述

这是完整的场景，

我有一个农业网格，现在我双击其中一行并获取该数据。

suppressPackageStartupMessages(library(httr))
url <- "https://raw.githubusercontent.com/scpike/us-state-county-zip/master/geo-data.csv"
zipcodeData <- content(GET(url),type = 'text/csv')

zipCaseGraph<- function(zip) {
    tbl.county <- subset(zipcodeData,zipcode == zip) 
    countyZip <- tbl.county$county
    stateZip <- tbl.county$state
    stateAbbr <- tbl.county$state_abbr
    url <- paste0("https://knowi.com/api/data/ipE4xJhLBkn8H8jisFisAdHKvep","FR5I4bGzRySZ2aaXlJgie?entityName=County%207%20day%20growth","%20rates&exportFormat=csv&c9SqlFilter=select%20*%20where","%20County%20like%20",gsub(" ","%20",countyZip),"%20County%20AND%20State%20like%20",stateZip))
    tbl.countyStats <- content(GET(url),type = 'text/csv')
    tbl.countyCases <- subset(tbl.countyStats,Type!="Deaths") #only has cases not death stats
    tbl.countyCases <- tbl.countyCases[seq(dim(tbl.countyCases)[1],1),] #flip row order so that stats start from earliest date and ends with latest date
    barplot(tbl.countyCases$"7_day_count",main=sprintf("Weekly COVID-19 Case Count in %s,%s",countyZip,stateAbbr),xlab="Weeks since 1/29/20",ylab="Weekly Infection Count")
}

zipCaseGraph("08243")

细节部分

rowDoubleClicked(row) {
    this.service.detail(this.a,row[this.a],this.detail).subscribe((data) => {

      // here i am able to get the data which is coming from backend.

      this.service.data.next(data); // via this I am sending the data to detail component

      window.open("detailComponent","_blank");  // opening the detail component in different tab
    });

  }

html文件

constructor(private service: Service) {
    this.service.data.subscribe((data) => {
      this.data= data;
      alert("a"); //  it is also not working
      debugger;
    });

  }

服务文件

<div *ngFor="let item of data | keyvalue">
    {{item}}
    {{item.key}}:{{item.value}}
  </div>
  abc{{data}}    // html page only showing abc

根据逻辑详细信息组件，应显示我在双击ag-grid时发送的数据。但它只显示本质上是静态的数据。

因此，基本上，如何在angular的新标签上发送数据。

解决方法

将数据从一个标签发送到另一个标签的几种方法。

1.LocalStorage

https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage

设置数据

localStorage.setItem('key',JSON.stringify(value));

获取数据

this.obj= JSON.parse(localStorage.getItem('key'));

要删除数据

   localStorage.removeItem('key');

2。 window.postMessage（）

https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage

另外，但不确定

window.document.write（） Angular: Pass variables to window.open();