如何根据各种值放置按钮

Question

如何根据存储在result中的值在html文件中显示按钮？

第 1.T 页

 class page1 {
    let result: string; //possible values of result can be 'additon', 
                        //'multiply','divide'.
    constructor(public serviceClass : ServiceClass){
     this.initialzie();
    }
    additon(){
      this.result = 'addition';
   }
    modulus(){
     //logic for this function.
    }
    initialize(){
    this.result = this.serviceClass.someFunction();
    }
    }

页1.html

//headers and title already implemented.
// buttons to implement now.
//**condition**: The below button is only shown on the basis of the value 
                  //populated in the result variable in .ts class.
<div> //if result = 'multiply, 'divide' then show this button.How to 
                     //implement this?
<button ion-button (click)="addition()">ADD ME</button>
</div>
<div> //if result = 'addition' then show this button.How to implement this?
<button ion-button (click)="modulus()">Modulus</button>
</div>

Answer 1

你可以使用*ngIf

<div *ngIf="result == 'multiply' || result == 'divide' "> 
<button ion-button (click)="addition()">ADD ME</button>
</div>

<div *ngIf="result == 'addition'"> 
<button ion-button (click)="modulus()">Modulus</button>
</div>