Select Dropdowns in Angular 2 a built with select and option elements. You use *ngFor to loop through your values and create options and use ngModel to keep track of the value as it changes.

<form #formRef="ngForm">
<select name="location" [ngModel]="locations[0]">
<option
*ngFor="let location of locations"
[value]="location"> {{location}} </option>
</select>
</form>

[Angular2 Form] Build Select Dropdowns for Angular 2 Forms的更多相关文章

  1. [Angular2 Form] Use RxJS Streams with Angular 2 Forms

    Angular 2 forms provide RxJS streams for you to work with the data and validity as it flows out of t ...

  2. [Angular2 Form] Create Radio Buttons for Angular 2 Forms

    Using Radio Buttons in Angular 2 requires a basic understanding of forms as well as how their labels ...

  3. [Angular2 Form] Create and Submit an Angular 2 Form using ngForm

    Forms in Angular 2 are essentially wrappers around inputs that group the input values together into ...

  4. [Angular2 Form] Angular 2 Template Driven Form Custom Validator

    In this tutorial we are going to learn how we can also implement custom form field validation in Ang ...

  5. Django之model.form创建select标签

    前言 之前我们学习了form表单验证用户输入格式和自动创建HTML,那么如果用户创建select标签时怎么办呢,先来看下这个东西: models.py 数据格式: class UserInfo(mod ...

  6. [Angular2 Form] Understand the Angular 2 States of Inputs: Pristine and Untouched

    Angular 2’s ngModel exposes more than just validity, it even gives you the states of whether the inp ...

  7. [Angular2 Form] Display Validation and Error Messaging in Angular 2

    Angular 2’s ngModel provides error objects for each of the built-in input validators. You can access ...

  8. [Angular2 Form] Style Validation in Angular 2 Forms

    Inputs using Angular 2’s ngModel automatically apply style classes of .ng-validand .ng-invalid each ...

  9. [Angular2 Form] Group Inputs in Angular 2 Forms with ngModelGroup

    The ngModelGroup directive allows you to group together related inputs so that you structure the obj ...

随机推荐

  1. backbone-1.3.3源码解析-----------Event

    第一次写,写的不对的请指正 backbone.js中的Event实现了自定义事件.自定义事件就是一个对象的键值对,key为事件名,value为一个function数组.在backbone这个对象中有一 ...

  2. Hamming Weight的算法分析(转载)

    看代码时遇到一个求32bit二进制数中1的个数的问题,感觉算法很奇妙,特记录学习心得于此,备忘. 计算一个64bit二进制数中1的个数. 解决这个问题的算法不难,很自然就可以想到,但是要给出问题的最优 ...

  3. 徐汉彬:亿级Web系统搭建——单机到分布式集群(转载)

    文章转载自http://www.csdn.net/article/2014-11-06/2822529/1 当一个Web系统从日访问量10万逐步增长到1000万,甚至超过1亿的过程中,Web系统承受的 ...

  4. bzoj3717: [PA2014]Pakowanie

    Time Limit: 90 Sec Memory Limit: 256 MBSubmit: 128 Solved: 43[Submit][Status][Discuss]Description 你有 ...

  5. HDU5874:Friends and Enemies

    题目链接: Friends and Enemies 分析: 是一道想法题,我们假设x个人互相敌对,然后有y个人与这x个人都是朋友,而这y个人互相敌对. 则有 x+y=m x*y<=n 举个例子: ...

  6. sqlite 批量插入, 重复插入(更新)

    [FMDBManager inDatabase:^(FMDatabase *db) { [db shouldCacheStatements]; //开始启动事务 [db beginTransactio ...

  7. Uva 11183 - Teen Girl Squad (最小树形图)

    Problem ITeen Girl Squad Input: Standard Input Output: Standard Output You are part of a group of n  ...

  8. koa redis 链接

    koa 是新一代框架 npm install koa-redis 代码如下 var koa = require('koa'); var http = require('http'); var sess ...

  9. openstack 实例迁移

  10. php基础知识(2)

    数据类型整体划分 标量类型: int, float, string, bool 复合类型: array, object 特殊类型: null, resouce 整数类型int, integer 3种整 ...