Getting Started

Search…

Getting Started

Opt-In APIs
Before we dive into any of the form features, we need to do a little bit of housekeeping. We need to bootstrap our application using the FormsModule or ReactiveFormsModule.
1
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'
2
import { FormsModule } from '@angular/forms';
3
import { AppComponent } from './components'
4
​
5
@NgModule({
6
  imports: [
7
    BrowserModule,
8
    FormsModule,
9
  ],
10
  declarations: [AppComponent],
11
  bootstrap: [AppComponent]
12
})
13
export class AppModule {
14
}
15
​
16
platformBrowserDynamic().bootstrapModule(AppModule)
Copied!
Input Labeling
Most of the form examples use the following HTML5 style for labeling inputs:
1
<label for="name">Name</label>
2
<input type="text" name="username" id="name">
Copied!
Angular also supports the alternate HTML5 style, which precludes the necessity of ids on <input>s:
1
<label>
2
  Name
3
  <input type="text" name="username">
4
</label>
Copied!

Forms

Template-Driven Forms

Last modified 2yr ago

Copy link

Contents

Opt-In APIs

Input Labeling