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 相关文章推荐
JS之小练习代码
Oct 12 Javascript
jquery 表格分页等操作实现代码(pagedown,pageup)
Apr 11 Javascript
jQuery 表单验证扩展代码(一)
Oct 11 Javascript
用于节点操作的API,颠覆原生操作HTML DOM节点的API
Dec 11 Javascript
js中substring和substr的定义和用法
May 05 Javascript
JS实现清除指定cookies的方法
Sep 20 Javascript
浅谈js 闭包引起的内存泄露问题
Jun 22 Javascript
浅谈javascript的Touch事件
Sep 27 Javascript
Web安全测试之XSS实例讲解
Aug 15 Javascript
.net MVC+Bootstrap下使用localResizeIMG上传图片
Apr 21 Javascript
浅谈Vue 初始化性能优化
Aug 31 Javascript
Element MessageBox弹框的具体使用
Jul 27 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
在smarty模板中使用PHP函数的方法
2011/04/23 PHP
PHP实现根据设备类型自动跳转相应页面的方法
2014/07/24 PHP
ThinkPHP模版中导入CSS和JS文件的方法
2014/11/29 PHP
总结PHP中DateTime的常用方法
2016/08/11 PHP
php实现微信支付之现金红包
2018/05/30 PHP
PHP5.5基于mysqli连接MySQL数据库和读取数据操作实例详解
2019/02/16 PHP
JS 容错处理代码, 屏蔽错误信息
2021/03/09 Javascript
改善你的jQuery的25个步骤 千倍级效率提升
2010/02/11 Javascript
jQuery powerFloat万能浮动层下拉层插件使用介绍
2010/12/27 Javascript
jQuery判断元素是否是隐藏的代码
2011/04/24 Javascript
使用闭包对setTimeout进行简单封装避免出错
2013/07/10 Javascript
JS字符串处理实例代码
2013/08/05 Javascript
jquery插件推荐 jquery.cookie
2014/11/09 Javascript
JavaScript监听文本框回车事件并过滤文本框空格的方法
2015/04/16 Javascript
详解JavaScript中localStorage使用要点
2016/01/13 Javascript
windows 下安装nodejs 环境变量设置
2017/02/02 NodeJs
JS简单实现自定义右键菜单实例
2017/05/31 Javascript
angular.js和vue.js中实现函数去抖示例(debounce)
2018/01/18 Javascript
JS随机数产生代码分享
2018/02/24 Javascript
bootstrap实现点击删除按钮弹出确认框的实例代码
2018/08/16 Javascript
JS学习笔记之数组去重实现方法小结
2019/05/29 Javascript
jQuery实现简单评论功能
2020/08/19 jQuery
[19:14]DOTA2 HEROS教学视频教你分分钟做大人-维萨吉
2014/06/24 DOTA
python连接远程ftp服务器并列出目录下文件的方法
2015/04/01 Python
python:pandas合并csv文件的方法(图书数据集成)
2018/04/12 Python
python实现PID算法及测试的例子
2019/08/08 Python
python实现代码统计器
2019/09/19 Python
Python实现代码统计工具
2019/09/19 Python
Python子进程subpocess原理及用法解析
2020/07/16 Python
Python如何定义接口和抽象类
2020/07/28 Python
Python爬取网页信息的示例
2020/09/24 Python
美国存储和组织商店:The Container Store
2017/08/16 全球购物
销售业务员岗位职责
2014/01/29 职场文书
《与朱元思书》的教学反思
2014/04/17 职场文书
中秋联欢会主持词
2015/07/04 职场文书
利用Matlab绘制各类特殊图形的实例代码
2021/07/16 Python