Angular.js 实现数字转换汉字实例代码


Posted in Javascript onJuly 14, 2016

AngularJS 简介

AngularJS 是一个 JavaScript 框架。它可通过 <script> 标签添加到 HTML 页面。

AngularJS 通过 指令 扩展了 HTML,且通过 表达式 绑定数据到 HTML。

下面通过本文给大家介绍Angular.js 实现数字转换汉字实例代码,具体代码如下所示:

// 1、实现输入数字输出对应汉字,要求使用angularjs,不准使用$watch函数,for循环;提示:ng-change指令
<div ng-app="myApp" ng-controller="changeCtrl"> // 定义一个app指令 定义一个controller 指令用于为你的应用添加控制器。在控制器中,你可以编写代码,制作函数和变量,并使用 scope 对象来访问。
数字: <input ng-model="number" ng-change="changeFunc(number)"> // ng-model 指令绑定了 HTML 表单元素到 scope 变量中。 如果 scope 中不存在变量, 将会创建它。 ng-change 事件在值的每次改变时触发
<h1>你输入了: {{result}}</h1> // 和ng-model数据绑定的值
</div>
<script>
var app = angular.module('myApp', []); // 新建一个模块,注意新的模块需要在 app.js 里面引入
app.controller('changeCtrl', function($scope) { // 建立controller方法 供html使用
$scope.number = ""; // 这里是input框中出现的值
$scope.result = ""; // 结果是h1中出现的值
var array=["零","一","二","三","四","五","六","七","八","九","十"];
$scope.changeFunc=function(number){ // 定义一个ng-change方法,当input内的值改变时出发(input内输入一个值,方法改变一次)
console.log("number=",number);
if(number != ''){ 
$scope.result = "";
var atr=number.replace(/(.)(?=[^$])/g,"$1,").split(",");//第一种 // 通过截取的形式每一个数字添加‘,'split把字符串变成数组 
atr.forEach(function(e){ // 循环数组atr
$scope.result += array[e];
});
/*for(var a in number){ //第二种 
console.log("number[a]=",number[a]);
var i = parseInt(number[a]);
$scope.result += array[i];
}*/
}
};
});
</script>

以上所述是小编给大家介绍的Angular.js 实现数字转换汉字实例代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
基于Jquery的将DropDownlist的选中值赋给label的实现代码
May 06 Javascript
jQuery拖动图片删除示例
May 10 Javascript
jQuery获取(选中)单选,复选框,下拉框中的值
Feb 21 Javascript
百度移动版的url编码解码示例
Apr 29 Javascript
js实现感应鼠标图片透明度变化的方法
Feb 20 Javascript
异步JS框架的作用以及实现方法
Oct 29 Javascript
基于javascript实现简单的抽奖系统
Apr 15 Javascript
仅一个form表单 js实现注册信息依次填写提交功能
Jun 12 Javascript
JavaScript实现弹出广告功能
Mar 30 Javascript
ionic2打包android时gradle无法下载的解决方法
Apr 05 Javascript
bootstrap table列和表头对不齐的解决方法
Jul 19 Javascript
在vant中使用时间选择器和popup弹出层的操作
Nov 04 Javascript
JavaScript——DOM操作——Window.document对象详解
Jul 14 #Javascript
window.close(); 关闭浏览器窗口js代码的总结介绍
Jul 14 #Javascript
Jquery实现遮罩层的简单实例(就是弹出DIV周围都灰色不能操作)
Jul 14 #Javascript
jQuery实现公告新闻自动滚屏效果实例代码
Jul 14 #Javascript
jQuery mobile在页面加载时添加加载中效果 document.ready 和window.onload执行顺序比较
Jul 14 #Javascript
javascript运算符语法全面概述
Jul 14 #Javascript
jQuery实现下拉框多选 jquery-multiselect 的实例代码
Jul 14 #Javascript
You might like
古巴咖啡 Cubita琥爵咖啡 独特的加勒比海风味咖啡
2021/03/06 新手入门
用PHP实现ODBC数据分页显示一例
2006/10/09 PHP
php权重计算方法代码分享
2014/01/09 PHP
PHP类继承 extends使用介绍
2014/01/14 PHP
PHP检查端口是否可以被绑定的方法示例
2018/08/09 PHP
jquery 最简单的属性菜单
2009/10/08 Javascript
jQuery插件 tabBox实现代码
2010/02/09 Javascript
JS 毫秒转时间示例代码
2013/09/22 Javascript
css+js实现部分区域高亮可编辑遮罩层
2014/03/04 Javascript
jquery统计用户选中的复选框的个数
2014/06/06 Javascript
Javascript 中创建自定义对象的方法汇总
2014/12/04 Javascript
浅谈被jQuery抛弃的函数及替代函数
2015/05/03 Javascript
浅谈JavaScript 中有关时间对象的方法
2016/08/15 Javascript
vue.js学习笔记:如何加载本地json文件
2017/01/17 Javascript
老生常谈jquery中detach()和remove()的区别
2017/03/02 Javascript
javascript 正则表达式分组、断言详解
2017/04/20 Javascript
浅析 NodeJs 的几种文件路径
2017/06/07 NodeJs
详谈js模块化规范
2017/07/07 Javascript
jquery获取transform里的值实现方法
2017/12/12 jQuery
基于vue-ssr服务端渲染入门详解
2018/01/08 Javascript
如何安装控制器JavaScript生成插件详解
2018/10/21 Javascript
React降级配置及Ant Design配置详解
2018/12/27 Javascript
vue-cli中vue本地实现跨域调试接口
2019/01/16 Javascript
如何基于原生javaScript生成带图片的二维码
2019/11/21 Javascript
python利用elaphe制作二维条形码实现代码
2012/05/25 Python
用smtplib和email封装python发送邮件模块类分享
2014/02/17 Python
使用Django Form解决表单数据无法动态刷新的两种方法
2017/07/14 Python
Django Admin中增加导出CSV功能过程解析
2019/09/04 Python
Python with语句和过程抽取思想
2019/12/23 Python
Pytorch之扩充tensor的操作
2021/03/04 Python
搬家公司的创业计划书
2014/01/01 职场文书
30岁生日感言
2014/01/25 职场文书
妈妈的账单教学反思
2014/02/06 职场文书
工作态度检讨书范文
2015/05/06 职场文书
15个值得收藏的JavaScript函数
2021/09/15 Javascript
win11电脑关机鼠标灯还亮怎么解决? win11关机后鼠标灯还亮解决方法
2023/01/09 数码科技