<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="../折叠菜单插件/3/js/jquery-1.7.2.min.js"></script>
<script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>
<script src="//cdn.bootcss.com/angular-websocket/2.0.1/angular-websocket.js"></script>
</head>
<body> <div ng-app="myApp" ng-controller="customersCtrl"> <!--<table>-->
<!--<tr ng-repeat="x in names">-->
<!--<td>{{ x.Name }}</td>-->
<!--<td>{{ x.Country }}</td>-->
<!--</tr>-->
<!--</table>-->
<ul ng-repeat="data in MyData.collection track by $index" >
<li> {{ data }} </li>
</ul>
</div> <script>
var app = angular.module('myApp', ['ngWebSocket'])
.factory('MyData', function ($websocket) {
// Open a WebSocket connection
var dataStream = $websocket('ws://118.145.23.94/rwservice'); var collection = []; dataStream.onMessage(function (message) {
collection.push(JSON.parse(message.data).data.desp);
}); var methods = {
collection: collection,
get: function () {
dataStream.send(JSON.stringify({action: 'get'}));
}
}; return methods;
})
.controller('customersCtrl', function ($scope, MyData) {
$scope.MyData = MyData;
});
; </script> </body>
</html>

  

angular-websocket.js 使用的更多相关文章

  1. 【angularjs基础】ng-repeat嵌套循环报错angular.min.js:89 Error: [ngRepeat:dupes]

    再写嵌套循环的时候,提示一个错误 angular.min.js: Error: [ngRepeat:dupes] 代码如下 <table class="GridViewTable mt ...

  2. Websocket -- JS的前端页面

    一个html5 WebSocket + JS的简单Echo例子,例子代码演示效果猛戳链接:websocket例子(打开页面,稍等一会) 使用一个文本编辑器,把下面代码复制保存在一个 websocket ...

  3. angular报错:angular.min.js:118Error: [ng:areq] http://errors.angularjs.org/1.5.8/ng/areq

    报错代码如下: <div ng-controller="HelloAngular"> <p>{{greeting.text}},angular</p& ...

  4. angular 调试 js (分 karms protractor / test e2e unit )

    首页订阅 Protractor端到端的AngularJS测试框架教程 2014年01月18日 分类:教程, JavaScript, AngularJS Protractor是一个建立在WebDrive ...

  5. Angular + Websocket

    Angular使用RxJS,它本质上是一个反应式扩展的javascript实现.这是一个使用可观察序列组成异步和基于事件的程序的库,非常适合使用WebSockets. 简而言之,RxJS允许我们从we ...

  6. angular数据绑定---js全局学习

    <!DOCTYPE html> <html ng-app> <head> <title>Simple app</title> </he ...

  7. 「译」Blazor VS React React / Angular / Vue.js

    原文作者: Christian Findlay 原文链接: https://christianfindlay.com/2020/06/04/blazor-vs-react-angular-vue-js ...

  8. angular controller js 压缩后报错解决方案

    简单介绍下ng-annotate这个项目,这个项目正好提供了gulp的插件. gulp配置文件: var gulp = require('gulp'); var ngAnnotate = requir ...

  9. angular.min.js:118 Error: [ng:areq] http://errors.angularjs.org/1.5.8/ng/areq?

    1,错误如图所示 简单说下错误原因是:没有js没有注册进去. 解决方法: 1.看下index.html有没有引入你的js文件. 2.看下app.js有没有注册js,比如我这次就是这步没做好,合并代码时 ...

  10. websocket js 代码样例

    function StartWebSocket(wsUri) { websocket = new WebSocket(wsUri); websocket.onopen = function(evt) ...

随机推荐

  1. python学习day11

    目录 SqlAlchemy 外键 SqlAlechemy SQLAlchemy是Python编程语言下的一款ORM框架,该框架建立在数据库API之上,使用关系对象映射进行数据库操作,简言之便是:将对象 ...

  2. 实战:mysql写存储过程并定时调用

    有表:cap_meter_detail 字段:recordtime 情景:recordtime每半个小时记录一次,故一天会产生很很多数据,我们要做的是,每天00:00:00对cap_meter_det ...

  3. 连接sql server、插入数据、从数据库获取时间(C#)

    using System; using System.Data.SqlClient; namespace Test { //连接数据库 public class Connection { privat ...

  4. Hibernate三种批量处理数据

    概念:批量处理数据是指在一个事务场景中处理大量数据. 在应用程序中难以避免进行批量操作,Hibernate提供了以下方式进行批量处理数据: (1)使用HQL进行批量操作  数据库层面  execute ...

  5. svn merge当主干修改后合并分支

    例如版本r1的主干创建分支r2,在r2上修改后得到r3,r1之后也修改得到r4,现在合并分支到主干上: 如果r3的修改和r4有冲突会提示出现冲突,因此不用担心主干合并后会被分支操作覆盖,因为这并不是简 ...

  6. openstack 存储节点按照报错Device /dev/sdb not found (or ignored by filtering).

    root@dell-PowerEdge-T30:~# pvcreate /dev/sdb  Device /dev/sdb not found (or ignored by filtering).首页 ...

  7. UVA 1220 Party at Hali-Bula (树形DP)

    求一棵数的最大独立集结点个数并判断方案是否唯一. dp[i][j]表示以i为根的子树的最大独立集,j的取值为选和不选. 决策: 当选择i时,就不能选择它的子结点. 当不选i时,它的子结点可选可不选. ...

  8. 特别困的学生 UVa12108(模拟题)

    一.题目 课堂上有n个学生(n<=10).每个学生都有一个“睡眠-清醒”周期,其中第i个学生醒Ai分钟后睡Bi分钟,然后重复(1<=Ai,Bi<=5),初始第i个同学处于他的周期的C ...

  9. 团队作业-Beta冲刺第二天

    这个作业属于哪个课程 <https://edu.cnblogs.com/campus/xnsy/SoftwareEngineeringClass1> 这个作业要求在哪里 <https ...

  10. 作用域插槽 向父组件传递 <template slot-scope="{ row, index }" slot="dateNo">

    作用域插槽 向父组件传递 <template slot-scope="{ row, index }"  slot="dateNo"> slotTes ...