角度检查按钮是否被点击

Question

我只想在单击按钮时显示更改的文本值。文本值取决于输入字段，并动态绑定到带有[(NgModel)]="textValue"的文本字段的输入值... 我首先在输入框中输入了一些 ID 号，它直接更改了我的文本。但是我只想在单击按钮后更改带有“ID-value”的文本，并使用我的函数“getChartsData()”调用新的图表数据。

这就是我的 html 的样子：

<input [(ngModel)]="monatConst" placeholder="Demonstrator-ID">
<button class="btn btn-danger float-xl-right mt-1" 
    (click) = "getChartsData()">  Call HTTP Request
  </button> 
<br>
<div *ngIf="monatConst">Chart für Demonstrator mit ID: {{monatConst}} </div><br>

<ngx-charts-bar-vertical
  [view]="view"
  [scheme]="colorScheme"
  [results]="dataArray"
  [gradient]="gradient"
  [xAxis]="showXAxis"
  [yAxis]="showYAxis"
  [legend]="showLegend"
  [showXAxisLabel]="showXAxisLabel"
  [showYAxisLabel]="showYAxisLabel"
  [xAxisLabel]="xAxisLabel"
  [yAxisLabel]="yAxisLabel">
</ngx-charts-bar-vertical>

我怎样才能最好地意识到只有在单击按钮并调用新图表数据后才会更改带有 ID 字段的文本？目前，我用ngModel两种方式绑定了ID变量，直接放到文本字段中，数据绑定{{..}}

Answer 1

我找到了一个更简单的解决方案，这对我来说非常愚蠢；）：

<div *ngIf="dataArray?.length>0; else noChartBlock">
    Chart für Demonstrator mit ID: {{monatConst}}
<ngx-charts-bar-vertical
  [view]="view"
  [scheme]="colorScheme"
  [results]="dataArray"
  [gradient]="gradient"
  [xAxis]="showXAxis"
  [yAxis]="showYAxis"
  [legend]="showLegend"
  [showXAxisLabel]="showXAxisLabel"
  [showYAxisLabel]="showYAxisLabel"
  [xAxisLabel]="xAxisLabel"
  [yAxisLabel]="yAxisLabel">
</ngx-charts-bar-vertical>
</div>

<ng-template #noChartBlock>
  <b>There is no data for Demonstrator with ID: {{monatConst}} !</b>
</ng-template> 

我只是将我的 Text 打包到 ngIf 选择器中，以便在找到某些内容时显示文本，否则它会转到 else 模板块... ;P

Answer 2

.html

 <input [(ngModel)]="monatConst" placeholder="Demonstrator-ID">
<button class="btn btn-danger float-xl-right mt-1" 
    (click) = "getChartsData();setText(monatConst)">  Call HTTP Request
  </button> 
<br>
<div *ngIf="Demonstrator_ID">Chart für Demonstrator mit ID: {{Demonstrator_ID}} </div><br>

.ts

   monatConst:any;
   Demonstrator_ID: any;

   setText(text){
      this.Demonstrator_ID=text;
    }