Angular флажок материала внутри формы для отображения и скрытия содержимого - PullRequest
Новая
       24

Angular флажок материала внутри формы для отображения и скрытия содержимого

0 голосов
/ 22 апреля 2020

Я пытаюсь включить в своем приложении флажок Angular Материал, который по умолчанию отключен, а при установленном значении для переменной устанавливается значение true. ng-container на странице имеет *ngIf, который должен показывать содержимое в флажке, отмечен.

У меня есть несколько таких на странице (не в группах), поэтому каждый из них использует свою собственную модель.

Например, в моем компоненте у меня есть логическое значение, инициализированное в начальное состояние : showMoreAccounting = false;

Я создаю флажок:

<mat-checkbox [(ngModel)]="showMoreAccounting">More accounting and reference</mat-checkbox>

и условный контейнер: 

   <ng-container *ngIf="showMoreAccounting">
    ...
   </ng-container>

Я могу установить флажок и переключить его визуальное состояние, но значение моего логического значения не изменяется.

ОБНОВЛЕНИЕ

После тестирования на Stackblitz , я вижу, что он не работает, как ожидалось, если мат -checkbox находится в теге form. Это работает за пределами одного.

ОБНОВЛЕНИЕ 2:

Похоже, что это работает, только если он входит в группу Reactive Forms, см. здесь обновлен Stackblitz .

Если я использую обычный флажок, работает: 

       <input type="checkbox"
                     name="showMore"
                     [(ngModel)]="showMoreAccounting"
                     id="showMore">&nbsp;<label for="showMore">More accounting and reference</label>
...