Angular6 * ngIf не загружает раздел div при первом нажатии кнопки поиска, вместо этого загружается при втором нажатии - PullRequest
Новая
       23

Angular6 * ngIf не загружает раздел div при первом нажатии кнопки поиска, вместо этого загружается при втором нажатии

0 голосов
/ 11 апреля 2019

Работая над отображением и скрытием раздела с помощью * ngIf, div не активируется при первом нажатии кнопки, но активируется при втором.Сценарий - при вводе номера кадра и нажатии кнопки поиска выполняется http-вызов, полученный номер проверяется на соответствие статусу, если он истинный или ложный, если ложный, раздел должен оставаться закрытым, то есть введенные данные неверны, еслиправильно, тогда раздел данных откроется и будет исправлен несколькими значениями.Ниже приведен код моего компонента, где я проверяю, является ли статус из моего ответа истинным или ложным, и отображает уведомление, как только мой статус является ошибочным.Проблема - хотя условие выполнено, мой раздел ngif не отображается, вместо этого отображается второй щелчок 

onSubmitVehicleDetails() {
        console.log(this.vehdetails.status)
        console.log(this.fetch_vehicle);
        let formValue1: any = {
            chassis_no: this.vehicleDetailsForm.value.chassis_no,
        }
        this.policyService.getVehicleNumber(formValue1)
            .pipe()
            .subscribe(vehdetails => {
                this.displayModalPolicy(vehdetails),
                console.log(this.vehdetails.status)
if(this.vehdetails.status === false){ 
    this.fetch_vehicle = false;
            console.log(this.fetch_vehicle)

}
else {
    this.fetch_vehicle = true;
    console.log(this.fetch_vehicle)

}
                    console.log('vehdetails: ', vehdetails); //
                (error: any) => this.errorMessage = <any>error;
                console.log(this.vehdetails.status)

            }
            )
    }
    displayModalPolicy(vehdetails): void {
        this.vehdetails = vehdetails;

        this.vehicleDetailsForm.patchValue({
            model_name: vehdetails.data.model_name,
            v_fuel: vehdetails.data.v_fuel,
            v_yom: vehdetails.data.v_yom,
            v_cc: vehdetails.data.v_cc,
            variant_name: vehdetails.data.variant_name,
            exshow_price: vehdetails.data.exshow_price,
            engine_no: vehdetails.data.engine_no,
        });
        console.log(vehdetails);
        // the data on the form
        console.log(this.vehdetails.status)
        console.log(this.fetch_vehicle)

    }

Это HTML 

<button mat-raised-button color="primary" type="button"
                                        (click)="[onSubmitVehicleDetails()]">Search</button>
                                    <p>
                                        {{fetch_vehicle}}
                                    </p>
                                </div>
                            </div>

                            <div *ngIf="fetch_vehicle">
                                <div class="form-group m-form__group row">
                                    <div class="col-lg-6">
                                        <img src="assets/app/media/img/logos/logo-1.png">
                                        <label class="col-lg-4 col-form-label">
                                            <h4>Vehicle Details</h4>
                                        </label>

                                    </div>

...