单击onSubmit时更新ngIf

时间:2019-01-23 17:43:36

标签: angular angularjs-directive

有什么简单的方法可以转换* ngif来显示由onSubmit(单击按钮)调用的图像?

当前,当在下拉菜单上选择一个项目时,它将触发图像的* ngIF。我要更改此设置,以便仅在选择onSubmit后才更改/更新图像。

    <button type="button" class="btn btn-default dropdown-toggle col" data-toggle="dropdown" aria-haspopup="true"
      aria-expanded="false">
      {{form.site}} <i class="fa fa-caret-down"></i>
    </button>
    <ul class="dropdown-menu col">
      <li role="menuitem"><a class="dropdown-item" (click)="form.site='main2'">Main 2</a></li>
      <li role="menuitem"><a class="dropdown-item" (click)="form.site='main3'">Main 3</a></li>
    </ul>

  <div class="input-group field">
    <button type="button" (click)="onSubmit($event)" [disabled]="isLoading" class="btn btn-primary col">Submit</button>
  </div>
  <!-- image loading -->
  <div class="row" *ngIf="!isLoading">
    <h5 *ngIf="form.site=='main2'">
      <img src="assets/img/small.png"> Today</h5>
    <h5 *ngIf="form.site=='main3'">
      <img src="assets/img/s_small.png"> Today</h5>
  </div>

1 个答案:

答案 0 :(得分:1)

更改下拉菜单项上的click事件,以调用您的打字稿类中的函数。该函数将设置一个变量,而* ngIf将不在该变量之内。