NgModel无法正常工作。共享组件[重复]

Question

这个问题在这里已有答案：

• Angular error: “Can't bind to 'ngModel' since it isn't a known property of 'input'” 16个答案
• Can't bind to 'ngModel' since it isn't a known property of 'input' 25个答案

我需要在我的Jhipster应用程序的几个站点中共享一个组件（4.8.2），并在文件中添加了我的组件：shared-libs.module.ts：

import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { CommonModule } from '@angular/common';
import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
import { NgJhipsterModule } from 'ng-jhipster';
import { InfiniteScrollModule } from 'ngx-infinite-scroll';
import { CookieModule } from 'ngx-cookie';

import { InfobipMailComponent} from '../infobip/infobip.mail.component'

@NgModule({
imports: [
    NgbModule.forRoot(),
    NgJhipsterModule.forRoot({
        // set below to true to make alerts look like toast
        alertAsToast: false,
        i18nEnabled: true,
        defaultI18nLang: 'en'
    }),
    InfiniteScrollModule,
    CookieModule.forRoot()
],
declarations: [
  InfobipMailComponent,
],
exports: [
    FormsModule,
    HttpModule,
    CommonModule,
    NgbModule,
    NgJhipsterModule,
    InfiniteScrollModule,
    InfobipMailComponent
]
})
export class Crm482SharedLibsModule {}

似乎一切顺利，但该组件中的NgModel指令已停止工作。

Can't bind to 'ngModel' since it isn't a known property of 'input'.

如果它是值，我把它没有指令{{value}}它完全读取它，问题是我在NgModel指令的“输入”中使用它

有人可以帮我解决问题吗？

谢谢。

Answer 1

如果你看一下这个角度文档：

https://angular.io/guide/ngmodule-faq#!#q-browser-vs-common-module

你会读到关于NgModel的信息：

如果您的组件具有[（ngModel）]双向绑定表达式，则从@ angular / forms导入FormsModule

在这里阅读如何：Import FormsModule，通过添加到@NgModule的导入部分你的FormsModule

这是一个演示，您可以在其中重现您的问题：

Template parse errors:
Can't bind to 'ngModel' since it isn't a known property of 'input'. ("

https://stackblitz.com/edit/angular-hwl3mv?file=app%2Fapp.module.ts

将FormsModule添加到@NgModule导入时的工作演示：

https://stackblitz.com/edit/angular-tlgbhj?file=app/app.module.ts