1

これは私のmain.jsです

var app = angular.module('app', []);

app.config(function ($routeProvider, $locationProvider) { 
   $locationProvider.html5Mode(true); // enable pushState
   $routeProvider.when('/', { 
      templateUrl: '/app.html',
      controller: 'AppCtrl'
   });
   $routeProvider.when('/another/route', { 
      templateUrl: '/deep.html',
      controller: 'AppCtrl'
   });
});
 var socket = io.connect('http://localhost');
  socket.on('news', function (data) {
    console.log(data);
    socket.emit('my other event', { my: 'data' });
  });
  socket.on('sendCustomer', function (data) {
    console.log(data);`
    //here i want to set controller scope 
  });
app.controller('AppCtrl', function ($scope) { 
    $scope.model = { 
       message: 'This is my app!!!' 
    };
    $scope.getCustomer = function(imageUrl) {
        alert("here i have to send command to socket io ");
        socket.emit('getCustomer', { });
    };

});

これはindex.htmlです

<!DOCTYPE html>
<html>
<head lang="en">
        <meta charset='utf-8'>
    <title>Egghead Videos</title>
    <link rel='stylesheet' href='/vendor/foundation/foundation.min.css'>
</head>
<body>

<div ng-app='app'>
   <ng-view></ng-view> 
</div>

<script type='text/javascript' src='/vendor/angularjs/angular.js'></script>
<script type='text/javascript' src='/socket.js'></script>
<script type='text/javascript' src='/main.js'></script>

</body>
</html>

これはapp.htmlです

<h1>{{model.message}}</h1>

<a href="" ng-click="getCustomer()">Get Customer Data</a>

<!-- here i want to do ng-repeat of customer data -->

これは私のサーバー.jsです

var express = require('express');

var app = require('express')()
  , server = require('http').createServer(app)
  , io = require('socket.io').listen(server);
var fs = require('fs');
server.listen(8000);
app.use(express.static(__dirname));
app.use(app.router);

app.get('/', function (req, res) { 
  res.set('content-type', 'text/html');
  res.send(fs.readFileSync(__dirname + '/index.html', 'utf8'));
});
app.get('/another/route', function (req, res) { 
  res.set('content-type', 'text/html');
  res.send(fs.readFileSync(__dirname + '/index.html', 'utf8'));
});
io.sockets.on('connection', function (socket) {
  socket.emit('news', { hello: 'world' });
  socket.on('my other event', function (data) {
    console.log(data);
  });
  socket.on('getCustomer', function (data) {
    console.log(data);
    socket.emit('sendCustomer', [{ name: 'c1' },{ name: 'c2' }]);
  });
});

したがって、クライアントの sendCustomer イベントが main.js で発生した場合、ng-repeat を介してコントローラーにそのデータを表示したいのですが、そうであればどうすればよいですか ..

4

2 に答える 2

2

まず、モジュール内で何かを使用する場合は、それを渡す必要があります。

app.controller('AppCtr', ['$scope', 'socket', function($scope, socket) { ...

Angular の外部のソケットで作業を行っているため、これらの変更を Angular の内部に表示するには、$apply() にも注意を払う必要があります。

これについてもっと詳しく書くこともできますが、実際には、Brian Ford の socket.io シードと関連するブログ投稿が、sockets + express + angular の最良の出発点です。

于 2013-07-19T15:52:47.063 に答える