页面上有两个按钮。每个按钮应弹出一个带有各自ID的不同模式。但是,两个按钮都触发相同的模式形式。
我已经为他们两个分配了ID,但是按钮仅触发请求模式形式,而不触发克隆帐户形式。
代码如下:
<button class="list-group-item collapsed" data-parent="#sidebar" [disabled]="!showAccountsTable" (click)="openCloneAccountModal(content)"><i class="far fa-clone"></i> <span class="hidden-sm-down"> Clone Selected Account</span> </button>
<button class="list-group-item collapsed" data-parent="#sidebar" [disabled]="!showMakerCheckerTable" (click)="openRequestModule(content)"><i class="fa fa-thumbs-up"></i><i class="fa fa-thumbs-down" ></i><span class="hidden-sm-down"> Accept/Decline Request</span> </button>
<ng-template #content let-modal>
<div class="modal-header">
<h4 class="modal-title" id="modal-basic-title">New Account</h4>
<button type="button" class="close" aria-label="Close" (click)="modal.dismiss('Cross click')">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
....
</div>
</ng-template>
<ng-template #content let-modal>
<!-- Update Reuest -->
<div class="modal-header">
<h4 class="modal-title" id="modal-request">Update Request</h4>
<button type="button" class="close" aria-label="Close" (click)="modal.dismiss('Cross click')">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="dropdown">
Approve
<select [(ngModel)]="approve" >
<option class="dropdown-item" [value]="true" >true</option>
<option class="dropdown-item" [value]="false" >false</option>
</select>
</div>
<div class="modal-body">
<form (ngSubmit)="onSubmitPending()">
<div class="modal-footer">
<button type="submit" class="btn btn-outline-dark" >Save</button>
</div>
</form>
</div>
</ng-template>
这是Typsecript:
openCloneAccountModal(content) {
this.newAccount = this.clonedAccount;
this.newAccount.lastUpdatedDate = new Date();
this.newAccount.enteredDate = new Date();
this.newAccount.enteredBy = "Hardcoded User Value (TEMP)";
this.newAccount.lastUpdatedBy = "Hardcoded User Value (TEMP)";
this.modalService.open(content).result.then((result) => {
this.closeResult = `Closed with: ${result}`;
}, (reason) => {
this.closeResult = `Dismissed ${this.getDismissReason(reason)}`;
});
}
openRequestModule(content){
console.log(this.pendingSelected);
console.log("id" + this.pendingSelected.id);
this.modalService.open(content).result.then((result) => {
this.closeResult = `Closed with: ${result}`;
}, (reason) => {
this.closeResult = `Dismissed ${this.getDismissReason(reason)}`;
});
}