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 相关文章推荐
excel操作之Add Data to a Spreadsheet Cell
Jun 12 Javascript
jquery 常用操作整理 基础入门篇
Oct 14 Javascript
jquery的flexigrid无法显示数据提示获取到数据
Jul 19 Javascript
JS 按钮点击触发(兼容IE、火狐)
Aug 07 Javascript
深入理解JavaScript系列(39):设计模式之适配器模式详解
Mar 04 Javascript
全面解析Bootstrap表单使用方法(表单控件状态)
Nov 24 Javascript
vue多级多选菜单组件开发
Sep 08 Javascript
详解获取jq ul第一个li定位的四种解决方案
Nov 23 Javascript
深入理解移动前端开发之viewport
Oct 19 Javascript
详解vue使用插槽分发内容slot的用法
Mar 28 Javascript
vue+web端仿微信网页版聊天室功能
Apr 30 Javascript
使用express来代理服务的方法
Jun 21 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中explode与split的区别介绍
2012/10/03 PHP
完善CodeIgniter在IDE中代码提示功能的方法
2014/07/19 PHP
PHP+MySQL之Insert Into数据插入用法分析
2015/09/27 PHP
基于thinkPHP类的插入数据库操作功能示例
2017/01/06 PHP
PHP 中使用explode()函数切割字符串为数组的示例
2017/05/06 PHP
从Ajax到JQuery Ajax学习
2007/02/14 Javascript
一款jquery特效编写的大度宽屏焦点图切换特效的实例代码
2013/08/05 Javascript
javascript:void(0)的作用示例介绍
2013/10/28 Javascript
jquery获取当前点击对象的value方法
2014/02/28 Javascript
JavaScript的jQuery库插件的简要开发指南
2015/08/12 Javascript
推荐阅读的js快速判断IE浏览器(兼容IE10与IE11)
2015/12/13 Javascript
JS中如何比较两个Json对象是否相等实例代码
2016/07/13 Javascript
js插件dropload上拉下滑加载数据实例解析
2016/07/27 Javascript
Angular 页面跳转时传参问题
2016/08/01 Javascript
echarts3 使用总结(绘制各种图表,地图)
2017/01/05 Javascript
jQuery插件zTree实现获取一级节点数据的方法
2017/03/08 Javascript
vue-cli脚手架搭建的项目去除eslint验证的方法
2018/09/29 Javascript
使用taro开发微信小程序遇到的坑总结
2019/04/08 Javascript
浅入深出Vue之自动化路由
2019/08/06 Javascript
js实现前端界面导航栏下拉列表
2020/08/27 Javascript
vue移动端写的拖拽功能示例代码
2020/09/09 Javascript
微信 用脚本查看是否被微信好友删除
2016/10/28 Python
解决Tensorflow安装成功,但在导入时报错的问题
2018/06/13 Python
Tensorflow中使用tfrecord方式读取数据的方法
2018/06/19 Python
使用Python实现分别输出每个数组
2019/12/06 Python
浅谈图像处理中掩膜(mask)的意义
2020/02/19 Python
Python变量及数据类型用法原理汇总
2020/08/06 Python
python程序实现BTC(比特币)挖矿的完整代码
2021/01/20 Python
用OpenCV进行年龄和性别检测的实现示例
2021/01/29 Python
日本最新流行服饰网购:Nissen
2016/07/24 全球购物
什么是用户模式(User Mode)与内核模式(Kernel Mode) ?
2015/09/07 面试题
英语专业学生个人求职信
2014/01/28 职场文书
2014年寒假社会实践活动心得体会
2014/04/07 职场文书
董存瑞观后感
2015/06/11 职场文书
总结一些Java常用的加密算法
2021/06/11 Java/Android
MySQL主从切换的超详细步骤
2022/06/28 MySQL