データターゲットが期待どおりに動作しない

Question

追加アイコンをクリックすると、ブートストラップモーダルを実装しようとしています。

デフォルトではdata-target="#undefined"が設定されています。クリックした後、データターゲットはdata-target="#myModal"に変更されています。

私は、デフォルトで、変更する条件に基づいてmyModalをdata-targetに設定したいと思っていますdata-targetからmyModalまたはalertModalです。

Image Reference

私はここにこだわっています。あなたは次のようにそれを行うことができます

public checkUnassigned() { 
 
    let eArray = this.pListComponent.evtNumber; 
 
    if (eArray.length > 0) { 
 
    this.modalName = "alertModal"; 
 
    } else { 
 
    this.modalName = "myModal"; 
 
    } 
 
}

<a class="icon-links"><i *ngIf="(selectedStatus == '01')" class="npt-icon-add icon-states" aria-hidden="true" 
 
       data-toggle="modal" [attr.data-target]="'#' + modalName" (click)="checkUnassigned()"></i></a>

Answer 1

を助けてください。しかし、常にpListComponent.evtNumberの値をチェックする必要があります。 が変更されたときにはcheckUnassigned()の機能を起動させるように、「ngDoCheck」（explanation）を使用することをお勧めします。

Goodluck！

isAlertModal:boolean = false; 
public checkUnassigned() { 
    let eArray = this.pListComponent.evtNumber; 
    if (eArray.length > 0) { 
    this.isAlertModal = true; 
    } else { 
    this.isAlertModal = false; 
    } 
} 


<a class="icon-links"> 
    <i *ngIf="((selectedStatus == '01') && (isAlertModal==false))" class="npt-icon-add icon-states" aria-hidden="true" 
     data-toggle="modal" [attr.data-target]="#myModal" (click)="checkUnassigned()"></i> 

    <i *ngIf="((selectedStatus == '01') && (isAlertModal==true))" class="npt-icon-add icon-states" aria-hidden="true" 
     data-toggle="modal" [attr.data-target]="#alertModal" (click)="checkUnassigned()"></i> 
</a>