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 相关文章推荐
关于Javascript 的 prototype问题。
Jan 03 Javascript
用javascript实现的支持lrc歌词的播放器
May 17 Javascript
jquery JSON的解析方式
Jul 25 Javascript
Bootstrap每天必学之面板
Nov 30 Javascript
JavaScript Date对象详解
Mar 01 Javascript
深入探究JavaScript中for循环的效率问题及相关优化
Mar 13 Javascript
Node.js实现兼容IE789的文件上传进度条
Sep 02 Javascript
JavaScript 闭包详细介绍
Sep 28 Javascript
利用vue写todolist单页应用
Dec 15 Javascript
超全面的javascript中变量命名规则
Feb 09 Javascript
微信小程序登录时如何获取input框中的内容
Dec 04 Javascript
Vue包大小优化的实现(从1.72M到94K)
Feb 18 Vue.js
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权限分配的实现代码
2013/04/28 PHP
迁移PHP版本到PHP7
2015/02/06 PHP
PHP随机数 C扩展随机数
2016/05/04 PHP
thinkphp中U方法按路由规则生成url的方法
2018/03/12 PHP
extjs之去除s.gif的影响
2010/12/25 Javascript
jQuery幻灯片带缩略图轮播效果代码分享
2015/08/17 Javascript
js实现微博发布小功能
2017/01/12 Javascript
angularJS 指令封装回到顶部示例详解
2017/01/22 Javascript
Jil,高效的json序列化和反序列化库
2017/02/15 Javascript
Vue路由跳转问题记录详解
2017/06/15 Javascript
JavaScript实现图片的放大缩小及拖拽功能示例
2019/05/14 Javascript
分析Python的Django框架的运行方式及处理流程
2015/04/08 Python
基于Python实现一个简单的银行转账操作
2016/03/06 Python
python脚本监控Tomcat服务器的方法
2018/07/06 Python
python判断一个数是否能被另一个整数整除的实例
2018/12/12 Python
Ubuntu下Anaconda和Pycharm配置方法详解
2019/06/14 Python
python打印异常信息的两种实现方式
2019/12/24 Python
Python迷宫生成和迷宫破解算法实例
2019/12/24 Python
使用tensorflow显示pb模型的所有网络结点方式
2020/01/23 Python
python实现每天自动签到领积分的示例代码
2020/08/18 Python
HTML5实现锚点时请使用id取代name
2013/09/06 HTML / CSS
Html5踩坑记之mandMobile使用小记
2020/04/02 HTML / CSS
Meli Melo官网:名媛们钟爱的英国奢侈手包品牌
2017/04/17 全球购物
商务英语本科生的自我评价分享
2013/11/15 职场文书
尽职尽责村干部自我鉴定
2014/01/23 职场文书
创业者是否需要商业计划书?
2014/02/07 职场文书
学生安全教育材料
2014/02/14 职场文书
实习单位评语
2014/04/26 职场文书
税务干部群众路线教育实践活动自我剖析材料
2014/09/21 职场文书
乡镇领导干部个人对照检查材料思想汇报
2014/09/23 职场文书
反腐倡廉剖析材料
2014/09/30 职场文书
派出所副所长四风问题个人整改措施思想汇报
2014/10/13 职场文书
python 实现定时任务的四种方式
2021/04/01 Python
Opencv中cv2.floodFill算法的使用
2021/06/18 Python
dubbo集成zipkin获取Traceid的实现
2021/07/26 Java/Android
用python基于appium模块开发一个自动收取能量的小助手
2021/09/25 Python