欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Angular+Node生成隨機數(shù)的方法

 更新時間:2017年06月16日 10:55:10   作者:YY''s  
這篇文章主要介紹了Angular+Node生成隨機數(shù)的方法,結(jié)合具體實例分析了Angular與Node結(jié)合控制前后端實現(xiàn)隨機數(shù)功能的相關(guān)操作技巧,需要的朋友可以參考下

本文實例講述了Angular+Node生成隨機數(shù)的方法。分享給大家供大家參考,具體如下:

以前寫過一個PHP生成隨機數(shù),然后jquey ajax獲取,再jQuery改變文本的隨機數(shù)的程序

現(xiàn)在用Angular 和 Node來重寫一下

Angular的好處是雙向綁定,這樣直接設(shè)置變量,不用再重新設(shè)置了

Node的好處我目前還不是很理解,可以通過count這個例子來說明一下Node和PHP的不同之處

當(dāng)然了,最大的好處就是,前后端都可以用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這時必須要用的
然后就是生成一個隨機數(shù)了,關(guān)鍵是count這個變量,后面執(zhí)行的時候每訪問一次,它都不一樣,說明Node是常駐內(nèi)存的,不想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訪問

PS:這里再為大家提供兩款功能類似的在線工具供大家參考:

在線隨機數(shù)字/字符串生成工具:
http://tools.jb51.net/aideddesign/suijishu

高強度密碼生成器:
http://tools.jb51.net/password/CreateStrongPassword

更多關(guān)于AngularJS相關(guān)內(nèi)容感興趣的讀者可查看本站專題:《AngularJS指令操作技巧總結(jié)》、《AngularJS入門與進階教程》及《AngularJS MVC架構(gòu)總結(jié)

希望本文所述對大家AngularJS程序設(shè)計有所幫助。

相關(guān)文章

  • angularjs數(shù)組判斷是否含有某個元素的實例

    angularjs數(shù)組判斷是否含有某個元素的實例

    下面小編就為大家分享一篇angularjs數(shù)組判斷是否含有某個元素的實例,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧
    2018-02-02
  • angularjs 指令實現(xiàn)自定義滾動條效果

    angularjs 指令實現(xiàn)自定義滾動條效果

    橫向商品欄,把原有的滾動條改成自定義的樣式,并且給兩邊加上箭頭可以調(diào)整,可以拖動商品和滾輪實現(xiàn)滾動條效果,這篇文章主要介紹了angularjs 指令實現(xiàn)自定義滾動條效果,需要的朋友可以參考下
    2024-03-03
  • Angular開發(fā)實踐之服務(wù)端渲染

    Angular開發(fā)實踐之服務(wù)端渲染

    這篇文章主要介紹了Angular開發(fā)實踐之服務(wù)端渲染,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧
    2018-03-03
  • AngularJS操作鍵值對象類似java的hashmap(填坑小結(jié))

    AngularJS操作鍵值對象類似java的hashmap(填坑小結(jié))

    我們知道java的hashmap中使用最多的是put(...),get(...)以及remove()方法,那么在angularJS中如何創(chuàng)造(使用)這樣一個對象呢?今天小編通過本文給大家分享下,感興趣的朋友一起學(xué)習(xí)吧
    2016-11-11
  • AngularJS ng-bind 指令簡單實現(xiàn)

    AngularJS ng-bind 指令簡單實現(xiàn)

    本文主要介紹AngularJS ng-bind 指令,在這里對ng-bind 指令做了詳細(xì)資料整理并講解,提供了實例代碼以便大家參考,有需要的小伙伴可以參考下
    2016-07-07
  • 基于AngularJS的拖拽文件上傳的實例代碼

    基于AngularJS的拖拽文件上傳的實例代碼

    本篇文章主要介紹了基于AngularJS的拖拽上傳的實例代碼,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧
    2017-07-07
  • AngularJS中使用three.js的實例詳解

    AngularJS中使用three.js的實例詳解

    這篇文章主要介紹了AngularJS中使用three.js的實例詳解,我將之前自己做的demo放到了angularJS的一個component中,其實一開始是沒有準(zhǔn)備用框架的但是后面發(fā)現(xiàn)需要進行的雙向綁定越來越多,后期表單數(shù)據(jù)的變化量也很大,最后還是選擇用NG來做這些事情
    2017-07-07
  • Angular性能優(yōu)化之第三方組件和懶加載技術(shù)

    Angular性能優(yōu)化之第三方組件和懶加載技術(shù)

    這篇文章主要介紹了Angular性能優(yōu)化之第三方組件和懶加載技術(shù),對性能優(yōu)化感興趣的同學(xué),可以參考下
    2021-05-05
  • AngularJS基礎(chǔ) ng-readonly 指令簡單示例

    AngularJS基礎(chǔ) ng-readonly 指令簡單示例

    本文主要介紹AngularJS ng-readonly 指令,這里對ng-readonly指令的資料做了整理,有學(xué)習(xí)AngularJS 指令的同學(xué)可以參考下
    2016-08-08
  • 深究AngularJS中$sce的使用

    深究AngularJS中$sce的使用

    本篇文章主要介紹了深究AngularJS中$sce的使用,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧
    2017-06-06

最新評論