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 相关文章推荐
模拟用户操作Input元素,不会触发相应事件
May 11 Javascript
改变隐藏的input中value的值代码
Dec 30 Javascript
深入理解JavaScript系列(31):设计模式之代理模式详解
Mar 03 Javascript
JavaScript实现拖拽元素对齐到网格(每次移动固定距离)
Nov 30 Javascript
利用js来实现缩略语列表、文献来源链接和快捷键列表
Dec 16 Javascript
jQuery使用方法
Feb 04 Javascript
JavaScript类的继承方法小结【组合继承分析】
Jul 11 Javascript
vue this.reload 方法 配置
Sep 12 Javascript
jQuery选择器之层次选择器用法实例分析
Feb 19 jQuery
微信小程序数据统计和错误统计的实现方法
Jun 26 Javascript
Vuex模块化应用实践示例
Feb 03 Javascript
React实现轮播效果
Aug 25 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
PHP面向对象之领域模型+数据映射器实例(分析)
2017/06/21 PHP
浅谈关于PHP解决图片无损压缩的问题
2017/09/01 PHP
PHP树形结构tree类用法示例
2019/02/01 PHP
基于thinkphp6.0的success、error实现方法
2019/11/05 PHP
JS实现在Repeater控件中创建可隐藏区域的代码
2010/09/16 Javascript
javascript校验价格合法性实例(必须输入2位小数)
2014/05/05 Javascript
node.js应用后台守护进程管理器Forever安装和使用实例
2014/06/01 Javascript
jQuery选择器全集详解
2014/11/24 Javascript
JavaScript模拟重力状态下抛物运动的方法
2015/03/03 Javascript
js实现缓冲运动效果的方法
2015/04/10 Javascript
简单对比分析JavaScript中的apply,call与this的使用
2015/12/04 Javascript
Bootstrap每天必学之级联下拉菜单
2016/03/27 Javascript
React.js入门实例教程之创建hello world 的5种方式
2016/05/11 Javascript
带有定位当前位置的百度地图前端web api实例代码
2016/06/21 Javascript
bootstrap-Treeview实现级联勾选
2017/11/23 Javascript
JS算法题之查找数字在数组中的索引位置
2019/05/15 Javascript
深入了解JavaScript词法作用域
2020/07/29 Javascript
js实现搜索提示框效果
2020/09/05 Javascript
python网络爬虫采集联想词示例
2014/02/11 Python
python字典的常用操作方法小结
2016/05/16 Python
Tensorflow 训练自己的数据集将数据直接导入到内存
2018/06/19 Python
详解python 模拟豆瓣登录(豆瓣6.0)
2019/04/18 Python
利用python实现周期财务统计可视化
2019/08/25 Python
python做接口测试的必要性
2019/11/20 Python
基于Python 中函数的 收集参数 机制
2019/12/21 Python
利用Python计算KS的实例详解
2020/03/03 Python
python实现画图工具
2020/08/27 Python
荷兰领先的百货商店:De Bijenkorf
2018/10/17 全球购物
Sisley法国希思黎中国官网:享誉全球的奢华植物美容品牌
2019/06/30 全球购物
简单说说tomcat的配置
2013/05/28 面试题
外贸实习生自荐信范文
2013/11/24 职场文书
统计学教授推荐信
2014/09/18 职场文书
住房抵押登记委托书
2014/09/27 职场文书
大学学生个人总结
2015/02/15 职场文书
《鲁班学艺》读后感3篇
2019/11/27 职场文书
Golang实现可重入锁的示例代码
2022/05/25 Golang