angular-websocket.js 使用

<!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>

  

原文地址:https://www.cnblogs.com/guozhe/p/6027087.html