基于基于AngularJS实现实现iOS8自带的计算器自带的计算器
的主要内容是使用angularjs实现一个计算器，是一个仿iOS8风格的计算器，功能基本和iOS自带的计算器是一
致的。有需要的朋友们可以参考借鉴。
前言前言
首先创建angularjs的基本项目就不说了，最好是利用yeoman这个脚手架工具直接生成,如果没有该环境的，当然也可以通过自
行下载angularjs的文件引入项目。
实例详解实例详解
main.js是项目的主要js文件，所有的js都写在这个文件中，初始化之后，该文件的js代码如下
angular
.module('calculatorApp', [
'ngAnimate',
'ngCookies',
'ngResource',
'ngRoute',
'ngSanitize',
'ngTouch'
])
.controller('MainCtrl', function ($scope) {
$scope.result="";
$scope.data={
"1":["AC","+/-","%","÷"],
"2":["7","8","9","×"],
"3":["4","5","6","－"],
"4":["1","2","3","＋"],
"5":["0",".","="]
};
});
这里的result是用来双向绑定显示运算结果的，data为计算器键盘上的数字和符号。
该项目相关的所有该项目相关的所有css代码如下：代码如下：
*{
margin:0;
padding:0;
}
body {
padding-top: 20px;
padding-bottom: 20px;
}
h1{
text-align:center;
color:#3385ff;
}
.main{
margin:20px auto;
border:1px solid #202020;
border-bottom: none;
width:60%;
height:600px;
}
.result{
display: block;
width: 100%;
height: 30%;
background:#202020;
box-sizing: border-box;
border:none;
padding: 0;
margin: 0;
resize: none;
color: #fff;
font-size: 80px;
text-align: right;
line-height: 270px;
overflow: hidden;
background-clip: border-box;
}
资源评论
weixin_38698927
- 粉丝: 7
- 资源: 980
最新资源
- 【安卓源代码】Android作业（完整前后端+mysql+说明文档）.zip
- 瓶子、键盘、电脑、老鼠、笔、人、手机检测30-YOLO（v5至v11）、COCO、CreateML、Paligemma、TFRecord、VOC数据集合集.rar
- 【Java学习+面试指南】 一份涵盖大部分Java程序员所需要掌握的核心知识
- 电子垃圾检测16-YOLO（v5至v11）、COCO、CreateML、Paligemma、TFRecord、VOC数据集合集.rar
- 登录系统123考试45
- 基于大数据python评价舆情LSTM系统 框架 vs2022 + python + echart + django + cnn + lstm + tensorflow + mysql + orm
- 22601134沈晨综合案例 .html
- Qt编写的一些开源的demo，支持Qt4、Qt5、Qt6，支持任意系统，预计会有100多个，一直持续更新完善，代码简洁易懂注释详细，每个都是独立项目，非常适合初学者，代码随意传播使用
- 这个是最开始的代码-登录系统
- 电子游戏检测32-YOLO（v5至v11）、COCO、CreateML、Paligemma、TFRecord、VOC数据集合集.rar
- 【wasm-rust图片png转pdf源码以及二进制发布】
- 网页设计，西藏网站设计与开发，大学生作业，毕业设计
- 互联网 Java 工程师进阶知识完全扫盲：涵盖高并发、分布式、高可用、微服务、海量数据处理等领域知识
- 基于大数据python评价舆情LSTM系统 框架 vs2022 + python + echart + django + cnn + lstm + tensorflow + mysql + orm
- 盒子和数字检测14-YOLO（v5至v9）、COCO、CreateML、Darknet、Paligemma、TFRecord数据集合集.rar
- 爱生活.exe爱生活1.exe爱生活2.exe
资源上传下载、课程学习等过程中有任何疑问或建议，欢迎提出宝贵意见哦~我们会及时处理！
点击此处反馈
