AngularJS, input textbox not even showing

Question

I'm just running some basic default boiler plate code and I edited this file:

app.component.html

<input type="text" [(ngModel)]="name">
  <p> {{name}} </p>

app.component.ts

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

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  name = '';
}

But this literally does nothing. There is just a blank page. What am I doing wrong? This seems so basic

Pankaj Parkar · Accepted Answer · 2017-08-14 21:37:56Z

1

Since ngModel directive included in FormsModule, you have to import and add that module inside imports metadata option of your AppModule.

Code

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

@NgModule({
  imports:      [ BrowserModule, FormsModule ], //<-- added FormsModule to imports option
  declarations: [ AppComponent ],
  bootstrap:    [ AppComponent ]
})
export class AppModule { }

Demo Here

answered Aug 14, 2017 at 21:37

Pankaj Parkar

136k23 gold badges241 silver badges307 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Pankaj Parkar Over a year ago

@Bana No way, please check plunker.. the app.module.ts is the file which you're looking for.

Bana Over a year ago

Thanks bro. It's working. But I'm curios, why was this not provided? I am watching a tutorial and he just did the same basic creation and simply used [(ngModule)] right off the bat without needing any of this?

Pankaj Parkar Over a year ago

@Bana I don't to re-write everything here, can you please refer Angular 2 two way binding using ngModel is not working which has everything mentioned precisely

Collectives™ on Stack Overflow

AngularJS, input textbox not even showing

1 Answer 1

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related