AngularJS基础 ng-list 指令详解及示例代码
AngularJS ng-list 指令
AngularJS 实例
转换用户的输入为数组:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script> </head> <body> <div ng-app=""> <p>在输入框中,输入一些文本,并使用逗号分隔它们:</p> <input ng-model="customers" ng-list/> <p>当使用 ng-list 指令时,你的输入信息会转换为数组,如下所示:</p> <pre>{{customers}}</pre> </div> </body> </html>
定义和用法
ng-list 指令将字符串转换为数组,并使用逗号分隔。
ng-list 指令还有另外一种转换方式,如果你有字符串数组希望在输入框中显示,你可以在 input 上使用 ng-list 指令。
ng-list 属性值定义了分隔符。
语法
<element ng-list="separator"></element>
<input>, <select>, <textarea>, 和其他可编辑元素支持该指令。
参数值
值 | 描述 |
---|---|
separator | 可选,定义分隔符,默认为", " |
以上就是对AngularJS ng-list 指令的资料整理,后续继续整理相关资料,谢谢大家支持!
相关推荐
-
AngularJS基础 ng-mouseenter 指令示例代码
AngularJS ng-mouseenter 指令 AngularJS 实例 在鼠标指针穿过元素时执行表达式: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script> </h
-
AngularJS基础 ng-model 指令详解及示例代码
AngularJS ng-model 指令 AngularJS 实例 绑定输入框的值到 scope 变量中: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script> </hea
-
AngularJS基础 ng-non-bindable 指令详细介绍
AngularJS ng-non-bindable 指令 AngularJS 实例 以下段落不需要使用 AngularJS 来编译: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script&
-
AngularJS基础 ng-mouseover 指令简单示例
AngularJS ng-mouseover 指令 AngularJS 实例 在鼠标指针移动到元素上时执行表达式: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script> </
-
AngularJS基础 ng-keypress 指令简单示例
AngularJS ng-keypress 指令 AngularJS 实例 按下按键时执行的代码: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script> </head>
-
AngularJS基础 ng-mouseleave 指令详解
AngularJS ng-mouseleave 指令 AngularJS 实例 在鼠标指针离开元素时执行表达式: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script> </h
-
AngularJS基础 ng-mousemove 指令简单示例
AngularJS ng-mousemove 指令 AngularJS 实例 在鼠标指针在元素上移动时执行表达式: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script> </
-
AngularJS ng-mousedown 指令
AngularJS ng-mousedown 指令 AngularJS 实例 在鼠标按下时执行表达式: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script> </head&g
-
AngularJS基础 ng-model-options 指令简单示例
AngularJS ng-model-options 指令 AngularJS 实例 在失去焦点时绑定输入框的值到 scope 变量中: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></scrip
-
Angularjs 自定义服务的三种方式(推荐)
AngularJS简介: AngularJS 通过新的属性和表达式扩展了 HTML. AngularJS 可以构建一个单一页面应用程序(SPAs:Single Page Applications). AngularJS 学习起来非常简单. angularjs 中可通过三种($provider,$factory,$service)方式自定义服务,以下是不同的实现形式: // 定义module , module中注入$provide var starterApp = angular.module('
随机推荐
- 介绍PostgreSQL中的Lateral类型
- Angular2 之 路由与导航详细介绍
- 跟我学Nodejs(二)--- Node.js事件模块
- Node.js事件循环(Event Loop)和线程池详解
- Asp.net后台调用js 2种方法
- Python PyQt5实现的简易计算器功能示例
- C++中对象的常引用、动态建立和释放相关知识讲解
- javascript控制在光标位置插入文字适合表情的插入
- ThinkPHP采用模块和操作分析
- 微信小程序开发一键登录 获取session_key和openid实例
- PHP按行读取文件时删除换行符的3种方法
- 微信小程序 获取javascript 里的数据
- cwrsync 四步实现windows备份
- 打造个性化的功能强大的Jquery虚拟键盘(VirtualKeyboard)
- 统计jQuery中各字符串出现次数的工具
- js动态切换图片的方法
- 图片跟随的代码
- C/C++获取目录下的文件列表信息
- asp.net实现微信公众账号接口开发教程
- bootstrap-Treeview实现级联勾选