AND operator in *ngIf in angular evaluates to true while it should not

Question

I have the following inside an ngx-datatable in angular:

<button ngbDropdownItem 
 *ngIf="(row['REQUEST_STATUS_TYPE_NO'] == 5 && ['ENROLL_TAX_PAYER'] | authority)">
                            {{ 'M.SUBMIT_FOR_SYSTEM_CHECK' | translate }}
  </button>

in the above code the ENROLL_TAX_PAYERcondition evaluates to true it should do so because the user has that permission. the row['REQUEST_STATUS_TYPE_NO'] == 5 part evaluates to false if if check it individually by {{row['REQUEST_STATUS_TYPE_NO'] == 5}}and that actually should. The problem is that when combined, it evaluates to true and the button gets displayed while it should not. what am I doing wrong?. When I make it like (row['REQUEST_STATUS_TYPE_NO'] == 5) && (['ENROLL_TAX_PAYER'] | authority) it works though. Is it not supposed to work in the first case too? I mean since REQUEST_STATUS_TYPE_NO is NOT five and the operator is AND the condition should evaluate as false.

Answer 1

Without brackets your condition is seen this way by TS. It first solves the pipe and then the &&.

row['REQUEST_STATUS_TYPE_NO'] == 
(5 && (['ENROLL_TAX_PAYER'] | authority))