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 相关文章推荐
javascript 短路法代码精简
Aug 20 Javascript
js去除空格的12种实用方法
Nov 08 Javascript
JavaScript动态插入CSS的方法
Dec 10 Javascript
Javascript之Math对象详解
Jun 07 Javascript
vue2.0嵌套路由实现豆瓣电影分页功能(附demo)
Mar 13 Javascript
IScroll那些事_当内容不足时下拉刷新的解决方法
Jul 18 Javascript
vuex 使用文档小结篇
Jan 11 Javascript
node实现的爬虫功能示例
May 04 Javascript
vue实现点击当前标签高亮效果【推荐】
Jun 22 Javascript
关于Vue Router中路由守卫的应用及在全局导航守卫中检查元字段的方法
Dec 09 Javascript
Vue Render函数原理及代码实例解析
Jul 30 Javascript
Vue.js 带下拉选项的输入框(Textbox with Dropdown)组件
Apr 17 Vue.js
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
实战mysql导出中文乱码及phpmyadmin导入中文乱码的解决方法
2010/06/11 PHP
批量修改RAR文件注释的php代码
2010/11/20 PHP
mysql_num_rows VS COUNT 效率问题分析
2011/04/23 PHP
php日期转时间戳,指定日期转换成时间戳
2012/07/17 PHP
php使用curl发送json格式数据实例
2013/12/17 PHP
PHP+Ajax实现上传文件进度条动态显示进度功能
2018/06/04 PHP
Thinkphp5 自定义上传文件名的实现方法
2019/07/23 PHP
防止网站内容被拷贝的一些方法与优缺点好处与坏处分析
2007/11/30 Javascript
多种方式实现JS调用后台方法进行数据交互
2013/08/20 Javascript
jQuery 事件的命名空间简单了解
2013/11/22 Javascript
javascript校验价格合法性实例(必须输入2位小数)
2014/05/05 Javascript
手机端页面rem宽度自适应脚本
2015/05/20 Javascript
用JavaScript显示浏览器客户端信息的超相近教程
2015/06/18 Javascript
整理Javascript数组学习笔记
2015/11/29 Javascript
论Bootstrap3和Foundation5网格系统的异同
2016/05/16 Javascript
JS/jQuery判断DOM节点是否存在的简单方法
2016/11/24 Javascript
详解angularJS+Ionic移动端图片上传的解决办法
2017/09/13 Javascript
微信小程序 功能函数小结(手机号验证*、密码验证*、获取验证码*)
2017/12/08 Javascript
利用vue和element-ui设置表格内容分页的实例
2018/03/02 Javascript
vue 项目接口管理的实现
2019/01/17 Javascript
vue实现随机验证码功能(完整代码)
2019/12/10 Javascript
git使用.gitignore设置不生效或不起作用问题的解决方法
2017/06/01 Python
对python 匹配字符串开头和结尾的方法详解
2018/10/27 Python
python检测IP地址变化并触发事件
2018/12/26 Python
Django用户认证系统 Web请求中的认证解析
2019/08/02 Python
python系列 文件操作的代码
2019/10/06 Python
Python连接mysql数据库及简单增删改查操作示例代码
2020/08/03 Python
Opencv常见图像格式Data Type及代码实例
2020/11/02 Python
HTML5 虚拟键盘出现挡住输入框的解决办法
2017/02/14 HTML / CSS
贝玲妃美国官方网站:Benefit美国
2016/08/28 全球购物
就业自荐信
2013/12/04 职场文书
求职简历中个人的自我评价
2013/12/25 职场文书
2014年幼儿园园务工作总结
2014/12/05 职场文书
店铺转让协议书
2015/01/29 职场文书
oracle连接ODBC sqlserver数据源的详细步骤
2021/07/25 Oracle
MySQL性能指标TPS+QPS+IOPS压测
2022/08/05 MySQL