38 lines
975 B
TypeScript
38 lines
975 B
TypeScript
|
/**
|
||
|
|
* @license
|
||
|
|
* Copyright Google Inc. All Rights Reserved.
|
||
|
|
*
|
||
|
|
* Use of this source code is governed by an MIT-style license that can be
|
||
|
|
* found in the LICENSE file at https://angular.io/license
|
||
|
|
*/
|
||
|
|
|
||
|
|
// #docregion Component
|
||
|
|
import {Component} from '@angular/core';
|
||
|
|
|
||
|
|
@Component({
|
||
|
|
selector: 'example-app',
|
||
|
|
template: `
|
||
|
|
<form #f="ngForm">
|
||
|
|
<select name="state" ngModel>
|
||
|
|
<option value="" disabled>Choose a state</option>
|
||
|
|
<option *ngFor="let state of states" [ngValue]="state">
|
||
|
|
{{ state.abbrev }}
|
||
|
|
</option>
|
||
|
|
</select>
|
||
|
|
</form>
|
||
|
|
|
||
|
|
<p>Form value: {{ f.value | json }}</p>
|
||
|
|
<!-- example value: {state: {name: 'New York', abbrev: 'NY'} } -->
|
||
|
|
`,
|
||
|
|
})
|
||
|
|
export class SelectControlComp {
|
||
|
|
states = [
|
||
|
|
{name: 'Arizona', abbrev: 'AZ'},
|
||
|
|
{name: 'California', abbrev: 'CA'},
|
||
|
|
{name: 'Colorado', abbrev: 'CO'},
|
||
|
|
{name: 'New York', abbrev: 'NY'},
|
||
|
|
{name: 'Pennsylvania', abbrev: 'PA'},
|
||
|
|
];
|
||
|
|
}
|
||
|
|
// #enddocregion
|