我的 [(ngModel)] 无法在 Ionic 4 的自定义组件中工作

Question

我正在我的 Ionic 4 项目中工作，并且创建了一个自定义组件，但在该自定义组件中我[(ngModel)]无法工作。

这是我的custom-header-component.component.html：

<ion-select [(ngModel)]="languageSelected" (ionChange)='setLanguage()' ngDefaultControl>
    <ion-select-option value="en">English</ion-select-option>
    <ion-select-option value="ar">Arabic</ion-select-option>
</ion-select>

在此 html 中，my[(ngModel)]不起作用，因为它没有在控制台中打印任何值。

这是我的自定义标头组件.component.ts：

languageSelected: any;
setLanguage() {
let me=this;
console.log('languageSelected',me.languageSelected);
}

在此 ts 文件中，它没有打印任何值。

也许问题是，我没有包含FormsModule.

这是我的文件夹：

custom-header-component:
|
-- custom-header-component.component.html
-- custom-header-component.component.scss
-- custom-header-component.component.spec.ts
-- custom-header-component.component.ts

components.module.ts

这是我的Components.module.ts：

import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { CustomHeaderComponentComponent } from './custom-header-component/custom-header-component.component';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';

@NgModule({
    declarations: [CustomHeaderComponentComponent],
    exports: [CustomHeaderComponentComponent],
    schemas: [CUSTOM_ELEMENTS_SCHEMA],
    imports: [
     FormsModule,
     ReactiveFormsModule
    ],
})
export class ComponentsModule{}

任何帮助深表感谢。

Answer 1

你只需要在 app.module.ts中导入FormsModule

import { FormsModule } from '@angular/forms';

并在声明和entryComponents中添加ComponentPage

你可以看下面的例子

在app.module.ts中

import { FormsModule } from '@angular/forms';

import { ComponentPage } from './component/component.page'


@NgModule({
  declarations: [
  ComponentPage,
 ],
entryComponents: [
   ComponentPage,
  ],
  imports: [FormsModule],

})