angularJS 中input示例分享


Posted in Javascript onFebruary 09, 2015

这里给大家分享一则input指令的使用示例

<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>无标题文档</title>

</head>

<script src="http://localhost:81/js/jquery.js">

</script>

<script src="http://localhost:81/js/angular.min.js">

</script>

<body ng-app="Demo">

<div ng-controller="TestCtrl">

    <input type="text" ng-model="a" test />

    <button ng-click="show(a)">查看</button>

</div>

</body>

<script>

   var app = angular.module('Demo', [], angular.noop);

   app.directive('test', function(){<br> //input 指令的 link有第四个参数,$ctrl有些方法,你可以自己拿来用

     var link = function($scope, $element, $attrs, $ctrl){

    console.log( $ctrl )

       $ctrl.$formatters.push(function(value){

         return value.join(',');

       });

       $ctrl.$parsers.push(function(value){

         return value.split(',');

       });

     }

     return {compile: function(){return link},

             require: 'ngModel',

             restrict: 'A'}

   });

   app.controller('TestCtrl', function($scope){

     $scope.a = [];

     //$scope.a = [1,2,3];

     $scope.show = function(v){

       console.log(v);

     }

   });

</script>

</html>

代码很简单,小伙伴们自由扩展下,希望大家能够喜欢

Javascript 相关文章推荐
音乐播放用的的几个函数
Sep 07 Javascript
javascript prototype原型操作笔记
Dec 07 Javascript
js面向对象设计用{}好还是function(){}好(构造函数)
Oct 23 Javascript
推荐40款强大的 jQuery 导航插件和教程(上篇)
Sep 14 Javascript
JavaScript中创建对象的模式汇总
Apr 19 Javascript
JavaScript队列的应用实例详解【经典数据结构】
Apr 12 Javascript
简单快速的实现js计算器功能
Aug 17 Javascript
JS获取子节点、父节点和兄弟节点的方法实例总结
Jul 06 Javascript
解决vue单页路由跳转后scrollTop的问题
Sep 03 Javascript
在layui下对元素进行事件绑定的实例
Sep 06 Javascript
vue路由 遍历生成复数router-link的例子
Oct 30 Javascript
ant design vue导航菜单与路由配置操作
Oct 28 Javascript
angularJS提交表单(form)
Feb 09 #Javascript
JavaScript实现16进制颜色值转RGB的方法
Feb 09 #Javascript
js选项卡的实现方法
Feb 09 #Javascript
js实现checkbox全选、不选与反选的方法
Feb 09 #Javascript
angularJS中router的使用指南
Feb 09 #Javascript
javascript实现按回车键切换焦点
Feb 09 #Javascript
jquery中ajax使用error调试错误的方法
Feb 08 #Javascript
You might like
php顺序查找和二分查找示例
2014/03/27 PHP
php批量删除数据库下指定前缀的表以prefix_为例
2014/08/24 PHP
PHP常量使用的几个需要注意的地方(谨慎使用PHP中的常量)
2014/09/12 PHP
Symfony2在Nginx下的配置方法图文教程
2016/02/04 PHP
微信支付之JSAPI公众号支付详解
2019/05/15 PHP
Javascript里使用Dom操作Xml
2007/01/22 Javascript
Javascript实现的鼠标经过时播放声音
2010/05/18 Javascript
Javascript 垃圾收集机制介绍理解
2013/05/14 Javascript
JS 两个字符串时间的天数差计算
2013/08/25 Javascript
javascript运算符——位运算符全面介绍
2016/07/14 Javascript
AngularJS中$apply方法和$watch方法用法总结
2016/12/13 Javascript
微信小程序 动态绑定事件并实现事件修改样式
2017/04/13 Javascript
AngularJS实现进度条功能示例
2017/07/05 Javascript
python从ftp下载数据保存实例
2013/11/20 Python
在Python中使用matplotlib模块绘制数据图的示例
2015/05/04 Python
Python中super的用法实例
2015/05/28 Python
Python中的连接符(+、+=)示例详解
2017/01/13 Python
python subprocess 杀掉全部派生的子进程方法
2017/01/16 Python
Python实现 多进程导入CSV数据到 MySQL
2017/02/26 Python
win10下tensorflow和matplotlib安装教程
2018/09/19 Python
Python中的函数式编程:不可变的数据结构
2018/10/08 Python
使用PM2+nginx部署python项目的方法示例
2018/11/07 Python
Python多进程方式抓取基金网站内容的方法分析
2019/06/03 Python
python ctypes库2_指定参数类型和返回类型详解
2019/11/19 Python
Python values()与itervalues()的用法详解
2019/11/27 Python
Python Json数据文件操作原理解析
2020/05/09 Python
Python+OpenCV检测灯光亮点的实现方法
2020/11/02 Python
HTML5 3D衣服摇摆动画特效
2016/03/17 HTML / CSS
JD Sports西班牙:英国领先的运动服装公司
2020/01/06 全球购物
结构和类有什么异同
2012/07/16 面试题
档案接收函范文
2014/01/10 职场文书
校本教研工作方案
2014/01/14 职场文书
小学语文课后反思精选
2014/04/25 职场文书
校园新闻广播稿5篇
2014/10/10 职场文书
HTML5简单实现添加背景音乐的几种方法
2021/05/12 HTML / CSS
使用Python开发贪吃蛇游戏 SnakeGame
2022/04/30 Python