Я пытаюсь создать компонент Angular Elements для встраивания на размещенную веб-страницу, и я хочу, чтобы мой компонент содержал реактивную форму Angular.
Сбой сборки с ошибкой: «Невозможно выполнить привязку к 'formGroup', поскольку это неизвестное свойство 'form'».
Кто-нибудь может определить, что я делаю не так?
Изменить: это Angular 9 и TypeScript 3.7, работающие на последней версии Angular CLI. Stackblitz: https://stackblitz.com/edit/angular-57wq1s
Изменить 2: обновленный код Stackblitz больше не вызывает ошибку времени компиляции, но элемент управления не завершает рендеринг. Кнопка «Отправить» не отображается. Если я удалю директиву formControlName из ввода пароля, компонент выполнит рендеринг полностью.
Изменить 3: StackBlitz, похоже, сейчас работает, но если я загружу на свой компьютер, npm install и ng serve, у меня возникнет проблема, когда он отобразит текстовое поле, но не кнопку.
Index.html
<!doctype html>
<html lang="en">
<body>
<app-password-reset></app-password-reset>
</body>
</html>
app.module.ts
@NgModule({
declarations: [],
imports: [
BrowserModule,
FormsModule,
ReactiveFormsModule
],
entryComponents: [PasswordResetComponent],
providers: [],
})
export class AppModule {
constructor(injector: Injector) {
const passwordResetElement = createCustomElement(PasswordResetComponent, {injector});
customElements.define('app-password-reset', passwordResetElement);
}
ngDoBootstrap(): void { }
}
password-reset.component.ts
@Component({
template: `
<form [formGroup]="resetForm" (ngSubmit)="formSubmit($event)">
<input type="password" formControlName="password">
<button type="submit">Reset Password</button>
</form>`
})
export class PasswordResetComponent {
constructor(private fb: FormBuilder) { }
resetForm = this.fb.group({
password: [null, Validators.required],
});
formSubmit(event: Event) {
alert('it works');
}
}
TypeError: Failed to construct 'HTMLElement': Please use the 'new' operator, this DOM object constructor cannot be called as a functionиз вашего общего stackblitz. Вы сохранили изменения после изменений в файле пакета? - person Sats schedule 20.02.2020