Question

我需要在我的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

NgModel无法正常工作。共享组件

1 个答案: