模态按钮以角度显示图像

问题描述

在我的项目中，我想在单击按钮时显示图像。如何在（单击）上配置 openModal() 方法来执行此操作？

IMG 取自 assets 目录，并根据您的代码（B1、B2）选择进行更改。

<!-- OPERATION -->
  <div class="card my-5">
    <div class="card-header" style="text-align: center; font-size: 20px;">
      <p><strong>Operation</strong></p>
    </div>
    <div class="card-body">
      <form>
        <div class="form-group">
          <tr *ngFor="let arr of varOperation; index as i">
            <td>
              Code: {{arr.operation.code}}
              - {{arr.operation.description}}
            </td>
            <button style="margin-left: 20px; float: right;" class="btn btn-primary" (click)="viewCodeOperation(arr.operation.code)" (click)="openModal()">
              Go
            </button>
          </tr>
        </div>  
      </form> 
    </div>
  </div>

  <!-- IMAGES -->
  <div class="overflow-auto">
    <div *ngIf="imgB1">
      <img src="assets\images\B1.jpg">
    </div>

    <div *ngIf="imgB2">
    <img src="assets\images\B2.jpg">
    </div>
  </div>

viewCodeOperation(code: string) {
    this.imgB1 = false
    this.imgB2 = false

    console.log(code)
    if(code == "B1"){
      this.imgB1 = true
    }
    else if(code == "B2"){
      this.imgB2 = true
    }
}

  openModal() {
  }

解决方法

您可以尝试使用 https://github.com/maximelafarie/ngx-smart-modal 这样的库来设置 angular 模式。