angularJS 中input示例分享
作者:bea
这里给大家分享一则input指令的使用示例 代码如下: <!doctype html> <html> <head> <meta charset="utf-8"> <title>无标题文档</title> </head> <script src=" http://localhost:81/js/jquery.js"> </script> <sc
这里给大家分享一则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>
代码很简单,小伙伴们自由扩展下,希望大家能够喜欢
有用 | 无用
代码如下:
<!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>
代码很简单,小伙伴们自由扩展下,希望大家能够喜欢
有用 | 无用
猜你喜欢
您可能感兴趣的文章:
- jquery动态添加删除(tr/td)
- javascript模拟map输出与去除重复项的方法
- JavaScript设置body高度为浏览器高度的方法
- jquery动态改变div宽度和高度
- angularJS结合canvas画图例子
- jquery实现上下左右滑动的方法
- js实现上传图片预览的方法
- js实现ifram取父窗口URL地址的方法
- jquery实现相册一下滑动两次的方法
- js点击选择文本的方法
- JS动态加载当前时间的方法
- JavaScript实现Java中StringBuffer的方法
- angularJS 入门基础
- javascript中函数作为参数调用的方法
- javascript自动生成包含数字与字符的随机字符串
- angularJS 中$scope方法使用指南
- Javascript动态创建div的方法
- angularJS 中$attrs方法使用指南
- JavaScript实现获取dom中class的方法