Нет доступа к значению для элемента управления формой с именем: 'country' после применения отложенной загрузки для ng-autocomplete. То же самое работает, когда ленивая загрузка не применяется.
<fieldset class="input-border rounded p-1">
<legend class="w-auto form-heading-txt">Resident Country</legend>
<ng-autocomplete [data]="countryList" formControlName="country" [searchKeyword]="keyword"
(selected)='selectEvent($event,"Country")' (inputChanged)='onChangeSearch($event)'
[itemTemplate]="itemTemplate" [notFoundTemplate]="notFoundTemplate">
</ng-autocomplete>
<ng-template #itemTemplate let-item>
<a [innerHTML]="item"></a>
</ng-template>
<ng-template #notFoundTemplate let-notFound>
<div [innerHTML]="notFound"></div>
</ng-template>
<div class="invalid-feedback errorCls" *ngIf="!isValidCountry">Please enter valid Country name</div>
<div *ngIf="submitted && f.country.errors" class="invalid-feedback errorCls">
<div *ngIf="f.country.errors.required">Country of Residence is mandatory</div>
</div>
</fieldset>
Мой модуль
import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { SharedModule } from '../shared.module';
import { RegistrationComponent } from './registration.component';
import { Routes, RouterModule } from '@angular/router';
const RRoutes : Routes =[{
path:'',
component:RegistrationComponent
}]
@NgModule({
declarations: [RegistrationComponent ],
exports:[RegistrationComponent ],
imports: [
CommonModule,
FormsModule,
ReactiveFormsModule,
SharedModule,
RouterModule.forChild(RRoutes)
],
schemas: [CUSTOM_ELEMENTS_SCHEMA]
})
export class RegistrationModule { }
Пожалуйста, помогите мне. Заранее спасибо