首页 > 解决方案 > angular 7在视图初始化后添加带有绑定的html

问题描述

我有一个问题,我想在我的 html 中添加这段代码

<dx-report-viewer [reportUrl]="reportUrl" height="800px">
   <dxrv-request-options [invokeAction]="invokeAction" [host]="hostUrl">
   </dxrv-request-options>
</dx-report-viewer>

但只有在从

self.queryParams = self.route.queryParams.subscribe(params => {      
  if (params['id']) {        
       self.ReportId = params['id']; // (+) converts string 'id' to a number
       console.log(self.ReportId);
       self.reportUrl += "ReportId=" + self.ReportId;
  }

因为否则 url 将是错误的......但我无法让它工作是因为 dx-report 是来自外部库的指令吗?

如果有人可以提供帮助会很棒!

标签: javascriptangulartypescript

解决方案


创建一个属性并将其默认为 false:

paramsAdded: boolean = false;

使用以下方法将报表元素包装在 div 中*ngIf

<div *ngIf="paramsAdded">
    <dx-report-viewer [reportUrl]="reportUrl" height="800px">
       <dxrv-request-options [invokeAction]="invokeAction" [host]="hostUrl">
       </dxrv-request-options>
    </dx-report-viewer>
</div>

当参数可用时,将属性设置为 true 以呈现报表元素:

self.queryParams = self.route.queryParams.subscribe(params => {      
  if (params['id']) {        
       self.ReportId = params['id']; // (+) converts string 'id' to a number
       console.log(self.ReportId);
       self.reportUrl += "ReportId=" + self.ReportId;

       self.paramsAdded = true;
  }

推荐阅读