【问题标题】:Updating an ngIf when onSubmit is clicked单击 onSubmit 时更新 ngIf
【发布时间】:2019-01-23 17:43:35
【问题描述】:

有什么简单的方法可以转换 *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>

【问题讨论】:

  • @Chellappan 我添加了更多细节

标签: angular angularjs-directive


【解决方案1】:

更改下拉项目上的单击事件以调用打字稿类中的函数。该函数将设置一个变量,并且 *ngIf 将关闭该变量。

【讨论】:

  • 你能举个粗略的例子吗?我已将 ng-click="formSite('main2')"(click)="form.site='main2'" 更改为
  • 如果我理解的话,您是说您将点击事件更改为“formSite('main2')”,所以现在您的打字稿文件中应该有一个 formSite(variableName: string) 方法将设置一个变量(比如 displayImage),您的 *ngIf 可以在您的图像上使用该变量来确定要显示的图像。
猜你喜欢
  • 2020-06-18
  • 1970-01-01
  • 2018-05-08
  • 2020-09-11
  • 1970-01-01
  • 1970-01-01
  • 2018-05-02
  • 2017-03-18
  • 1970-01-01
相关资源
最近更新 更多