Директива Angular 5 * ngIf ведет себя странно с логической переменной конструктора

Question

Я использую Angular 5.2 версию в своем проекте, и это делает очень странную проблему в регионе DEV.

Код компонента HTML выглядит следующим образом: -

    <div [hidden]="!_isFlag">
        <div class="pt-2 row">
            <div class="col-xs-12 col-md-3">
                <div class="form-group">
                   <input type="text" class="form-control" id="pName" placeholder="Last Name">
                 </div>
             </div>
          </div>                    
  </div>


   <div [hidden]="_isFlag">
        <div class="pt-2 row">
            <div class="col-xs-12 col-md-3">
                <div class="form-group">
                    <input type="text" class="form-control" id="pNum" placeholder="Given Number">
                </div>
            </div>    
        </div>
</div>

И файл component.ts выглядит следующим образом ниже._CurrUser заполняется с помощью объекта localStorage, который отличается для каждого вошедшего в систему пользователя.

    public _isFlag: boolean = false;    

    constructor(){
            this._isFlag= (<boolean>_currUser.isFlag);
    }

По какой-то причине только первый блок HTML-кода обрабатывается независимо от значения _isFlag.Второй блок HTML-кода никогда не появляется, даже если он соответствует значению _isFlag.

Это действительно странно.

Answer 1

Попробуйте ниже.

Вместо назначения флага в конструкторе назначьте его в ngOnInit.

ngOnInit(){

this._isFlag= (<boolean>_currUser.isFlag);
}

Answer 2

Значение isFlag, вероятно, является строкой "true" из "false" вместо значения true или value; и если ("ложь") на самом деле истина, потому что строка преобразуется в истинное значение в JavaScript. Попробуйте это:

constructor(){
    this._isFlag= (_currUser.isFlag === 'true');
}