Ги каждый,
Я очень новичок в Angular , и я обнаружил следующую проблему, пытаясь скрыть div и его содержимое в представлении. Я пытаюсь использовать директиву NgShow , как описано в этом руководстве: https://scotch.io/tutorials/how-to-use-ngshow-and-nghide
У меня следующая ситуация. В компоненте у меня есть представление с именем mail-datail-protocollo-sidebar.component.html . Он содержит div, для которого я установил директиву ng-show , что-то вроде этого:
<div class="info-box" ng-show="showSelectAOOUORLists">
<div class="title-box">Lista AOO</div>
<p-dropdown placeholder="Selezionare un AOO"
[options]="aooList"
[(ngModel)]="selectedAoo"
optionLabel="Name"
(onChange)="onChangeAoo($event)">
</p-dropdown>
<div *ngIf="selectedAoo">
<div class="title-box" style="margin-top: 20px;">Lista UOR</div>
<p-dropdown placeholder="Selezionare un reparto relativo all'AOO selezionato"
[options]="uorList"
[(ngModel)]="selectedUor"
optionLabel="UnitaOperativaResponsabile">
</p-dropdown>
</div>
<div style="margin-top: 28px; width: 30%">
<button *ngIf="selectedUor"
type="button"
pButton icon="fa-stamp"
label="Invia al protocollo"
(click)="inviaProtocollo($event)"></button>
</div>
</div>
Как видите, я установил ng-show = "showSelectAOOUORLists" , поэтому теоретически он должен использовать значение логической переменной с именем showSelectAOOUORLists , определенное в связанном классе контроллера.
Тогда у меня есть класс контроллера предыдущего представления с именем mail-datail- protocollo-sidebar.component.ts , который содержит эту логическую переменную, используемую для отображения или скрытия предыдущего div:
@Component({
selector: 'mail-detail-protocollo-sidebar',
templateUrl: '/app/maildetail/mail-detail-protocollo-sidebar/mail-datail-protocollo-sidebar.component.html',
styleUrls: ['../../app/maildetail/mail-detail-protocollo-sidebar/mail-detail-protocollo-sidebar.component.css']
})
export class MailDetailProtocolloSidebarComponent implements OnInit {
showSelectAOOUORLists: boolean;
.........................................................
.........................................................
.........................................................
constructor(
private mailsService: MailsService,
private mailDetailProtocolloService: MailDetailProtocolloService
) { }
ngOnInit(): void {
this.showSelectAOOUORLists = false;
...............................................................
...............................................................
...............................................................
}
.........................................................
.........................................................
.........................................................
}
Итак, как вы можете видеть, в основном на данный момент я устанавливаю false значение переменной showSelectAOOUORLists (в ngOnInit () , так что теоретически до этого страница отображается), чтобы скрыть div и его содержимое.
Проблема в том, что этот div все еще отображается на странице.
Почему? Что случилось? Что мне не хватает? Как я могу исправить это поведение? Используйте нг-шоу это правильный способ сделать это?