Angular+Node生成随机数的方法


Posted in Javascript onJune 16, 2017

本文实例讲述了Angular+Node生成随机数的方法。分享给大家供大家参考,具体如下:

以前写过一个PHP生成随机数,然后jquey ajax获取,再jQuery改变文本的随机数的程序

现在用Angular 和 Node来重写一下

Angular的好处是双向绑定,这样直接设置变量,不用再重新设置了

Node的好处我目前还不是很理解,可以通过count这个例子来说明一下Node和PHP的不同之处

当然了,最大的好处就是,前后端都可以用JavaScript来写了,这样的话Javascript的水平就会大幅提高!

Node

app.js

var express = require('express');
var app = express();
var count = 0;
app.get('/', function (req, res) {
 res.header('Access-Control-Allow-Origin', '*');
 var x = Math.floor(Math.random() * 1e6);
 res.send(String(x));
 console.log(count++);
});
app.listen(3000, function () {
 console.log('Example app listening on port 3000!');
});
res.header('Access-Control-Allow-Origin', '*');

这个涉及到跨域的问题,加上这句话就不是本地的也能访问了,以后要做hybrid APP这时必须要用的
然后就是生成一个随机数了,关键是count这个变量,后面执行的时候每访问一次,它都不一样,说明Node是常驻内存的,不想PHP,加载完了事

Angular

<!DOCTYPE html>
<html>
<head>
 <meta charset="utf-8">
 <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
</head>
<body>
 <div ng-app="myApp" ng-controller="customersCtrl">
  {{names}}
  <button ng-click="myClick()">获取签到码</button>
 </div>
 <script>
  var app = angular.module('myApp', []);
app.controller('customersCtrl', function($scope, $http) {
 $scope.myClick = function(){
  $http.get("http://localhost:3000").success(function (response) {$scope.names = response;});
 }
});
 </script>
</body>
</html>

有一些概念:

module

ng-app 模块,目前的理解是模块化

Controller

ng-controller 控制器 是个 对象
对象包含成员,用$scope访问

Javascript 相关文章推荐
SWFObject 2.1以上版本语法介绍
Jul 10 Javascript
Javascript new关键字的玄机 以及其它
Aug 25 Javascript
FF IE浏览器修改标签透明度的方法
Jan 27 Javascript
JavaScript实现SHA-1加密算法的方法
Mar 11 Javascript
JavaScript中的条件判断语句使用详解
Jun 03 Javascript
浅谈jQuery中height与width
Jul 06 Javascript
js弹出窗口返回值的简单实例
May 28 Javascript
JS简单封装的图片无缝滚动效果示例【测试可用】
Mar 22 Javascript
神级程序员JavaScript300行代码搞定汉字转拼音
May 20 Javascript
vue下载excel的实现代码后台用post方法
May 10 Javascript
js页面加载后执行的几种方式小结
Jan 30 Javascript
Nest.js参数校验和自定义返回数据格式详解
Mar 29 Javascript
JS利用正则表达式实现简单的密码强弱判断实例
Jun 16 #Javascript
vue高德地图之玩转周边
Jun 16 #Javascript
JavaScript实现提交模式窗口后刷新父窗口数据的方法
Jun 16 #Javascript
JS 组件系列之BootstrapTable的treegrid功能
Jun 16 #Javascript
vue之数据交互实例代码
Jun 16 #Javascript
基于jQuery和CSS3实现APPLE TV海报视差效果
Jun 16 #jQuery
JS基于正则实现数字千分位用逗号分隔的方法
Jun 16 #Javascript
You might like
thinkphp实现发送邮件密码找回功能实例
2014/12/01 PHP
Linux php 中文乱码的快速解决方法
2016/05/13 PHP
thinkPHP显示不出验证码的原因与解决方法分析
2017/05/20 PHP
Prototype使用指南之ajax
2007/01/10 Javascript
基于Jquery+Ajax+Json的高效分页实现代码
2011/10/29 Javascript
JavaScript prototype 使用介绍
2013/08/29 Javascript
jquery购物车实时结算特效实现思路
2013/09/23 Javascript
javascript 小数取整简单实现方式
2014/05/30 Javascript
jquery+css3打造一款ajax分页插件(自写)
2014/06/18 Javascript
jQuery on()方法绑定动态元素的点击事件实例代码浅析
2016/06/16 Javascript
js倒计时简单实现代码
2016/08/11 Javascript
jQuery+正则+文本框只能输入数字的实现方法
2016/10/07 Javascript
javascript获取以及设置光标位置
2017/02/16 Javascript
JavaScript数组迭代方法
2017/03/03 Javascript
AngularJs每天学习之总体介绍
2017/08/07 Javascript
vue如何将v-for中的表格导出来
2018/05/07 Javascript
React中嵌套组件与被嵌套组件的通信过程
2018/07/11 Javascript
JavaScript之解构赋值的理解
2019/01/30 Javascript
详解Node.js一行命令上传本地文件到服务器
2019/04/22 Javascript
用js简单提供增删改查接口
2019/05/12 Javascript
JS实现简单的文字无缝上下滚动功能示例
2019/06/22 Javascript
js实现一个简易计算器
2020/03/30 Javascript
layui下拉框获取下拉值(select)的例子
2019/09/10 Javascript
[59:00]OG vs TNC 2018国际邀请赛小组赛BO2 第一场 8.19
2018/08/21 DOTA
利用pandas读取中文数据集的方法
2018/07/25 Python
Python Pandas 箱线图的实现
2019/07/23 Python
python 批量修改 labelImg 生成的xml文件的方法
2019/09/09 Python
Django框架安装方法图文详解
2019/11/04 Python
python 将视频 通过视频帧转换成时间实例
2020/04/23 Python
keras训练曲线,混淆矩阵,CNN层输出可视化实例
2020/06/15 Python
当文件系统受到破坏时,如何检查和修复系统?
2012/03/09 面试题
大学生秋游活动方案
2014/02/17 职场文书
2015年先进个人自荐书
2015/03/24 职场文书
谢师宴家长答谢词
2015/09/30 职场文书
MySQL8.0.24版本Release Note的一些改进点
2021/04/22 MySQL
Python Pandas知识点之缺失值处理详解
2021/05/11 Python