Получение ошибки: невозможно привязать к «ngModel», так как это не известное свойство «ввода», несмотря на импорт FormsModule

Я импортировал FormsModule в свой app.module.ts, но все еще получаю эту ошибку.

Невозможно привязать к «ngModel», так как это неизвестное свойство «ввода»

Я просмотрел похожие сообщения, но до сих пор не могу найти решение для этого.

app.module.ts

 import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import {FormsModule} from '@angular/forms';
import { AppComponent } from './app.component';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

app.component.ts

import { Component } from '@angular/core';
import {FormsModule} from '@angular/forms';
import {NgModule  } from "@angular/core";
import { BrowserModule } from '@angular/platform-browser';

@NgModule({
  imports: [BrowserModule, FormsModule],
  declarations: [ 
    AppComponent
  ],
  bootstrap: [AppComponent]
  })

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html'


})
export class AppComponent {
}

app.component.html

<input type=radio name="gender" value="Mr" [(ngModel)]="gender">Male
<input type=radio name="gender" value="Mrs" [(ngModel)]="gender">Female
{{"Hello " + gender}}

angular angular2-forms angular2-directives
person priya    schedule 23.10.2017    source источник
comment
почему у вас есть ngModule в appcomponent?   -  person AJT82    schedule 23.10.2017
comment
вы действительно должны узнать, как работают угловые приложения. Лучший способ начать — понять этот пример: angular.io/tutorial.   -  person jetblack    schedule 23.10.2017

Ответы (1)


arrow_upward
5
arrow_downward

Попробуйте так:

app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { AppComponent } from './app.component';

@NgModule({
    declarations: [
        AppComponent
    ],
    imports: [
        FormsModule,
        BrowserModule
    ],
    providers: [],
    bootstrap: [AppComponent]
})
export class AppModule { }

app.component.ts

import { Component } from '@angular/core';

@Component({
    selector: 'app-root',
    templateUrl: './app.component.html'
})
export class AppComponent {
    gender: string;
}

app.component.html

<input type=radio name="gender" value="Mr" [(ngModel)]="gender">Male
<input type=radio name="gender" value="Mrs" [(ngModel)]="gender">Female
{{"Hello " + gender}}
person Chandru    schedule 23.10.2017
comment
Это сработало. Большое спасибо :) - person priya; 23.10.2017