Что означает [class.notvalid] в коде

Question

Я довольно новый в Angular, пожалуйста, помогите со следующим кодом в Angular. У нас есть специальное окно, которое проверяет данные клиента. Вы вводите специальный номер счета, после чего появится POPup, и вы должны ввести номер карты. Но когда мы вводим неправильный номер карты в поле ввода (которое он не может найти в бэкэнде), POPup рассеивается, и он не должен работать таким образом. Окно POPup должно остаться, и вы можете указать другой номер карты для проверки карты. Я думаю, что проблема с проверкой может быть, я не уверен, но я думаю, что оценка связана с [class.notvalid] Но я не знаю значение кода [class.notvalid]. Пожалуйста, объясните, если вы можете значение [class.notvalid]

У меня есть Angular CLI: версия 8.3.5. Мне было трудно попытаться исправить код, так как я не могу понять некоторые модули в Angular

Transfer.html

            <p class="input-label" [translate]="'page.transfers.RECIPIENT_IIN_BIN'" [class.notvalid]="iin && !finn?.valid">IIN/BIN of customer</p>
            <div class="input-w"
                 [class.input-w-error]="recipient !== undefined && !recipient.success">
              <input type="tel" maxlength="12" class="input"
                     #finn="ngModel"
                     [(ngModel)]="iin"
                     (keyup)="searchRecipientOtherBank(iin, iban)"
                     [class.notvalid]="iin && !finn?.valid"
                     pattern="^[0-9]{0,12}$"
                     require/>
            </div>
          </div> 

Я ожидаю, что когда вы введете номер карты, POPup не будети вы можете попытаться поставить еще один номер

Answer 1

[class.input-w-error] и [class.notvalid] - угловые директивы для доступа к классам css в формате - ("class.css-class-name").

Класс используется, когда назначенное условие оценивает true. В приведенном выше коде - [class.notvalid]="iin && !finn?.valid"

.notvalid класс добавляется к классам, если iin && !finn?.valid оценивает значение true.