Angularjs + socket +无法将数据传递给控制器

时间:2016-09-29 11:24:07

标签: javascript angularjs node.js sockets

我是这个插槽的新手。我使用后端节点js和前端angularjs。

我的数据在服务中打印但无法将数据输入控制器。

server.js:

var server = app.listen(port);
var io = require('socket.io').listen(server);
io.on('connection', function(socket) {
    setInterval(function() {
        socket.emit('addCustomer', {
            time : new Date() + "8989"
        });
    }, 1000);
});

service.js:

var app = angular.module(' myApp');

app.factory('socket', ['$rootScope',
function($rootScope) {
    var socket = io.connect('http://localhost:9090');

    return {
        // replace with the code below
        on : function() {//on: function(addCustomer){
            socket.on("addCustomer", function(customer) {
                console.log("Socket Factory - customer added", customer);
                return customer;
            });
        },
        emit : function(addCustomer, data) {
            console.log("rk");
            console.log(data);
            socket.emit(addCustomer, data);
        }
    };
}]); 

controller.js:

var app = angular.module('myApp');

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

    socket.on('addCustomer', function(data) {
        console.log(data);
        console.log("--")
        $scope.time = data.time;
    });

}) 

在工厂文件的控制台中输出打印。但是我无法将这些数据传递给控制器​​。请任何人帮忙解决这个问题。

控制台输出

Socket Factory - customer added Object {time: "Thu Sep 29 2016 16:52:44 GMT+0530 (IST)8989"}
socketService.js:11 Socket Factory - customer added Object {time: "Thu Sep 29 2016 16:52:45 GMT+0530 (IST)8989"}
socketService.js:11 Socket Factory - customer added Object {time: "Thu Sep 29 2016 16:52:46 GMT+0530 (IST)8989"}

2 个答案:

答案 0 :(得分:0)

当您在角度lifectycle之外更改数据时(非角度异步函数),您应该运行角度摘要

socket.on('addCustomer', function(data) {
        console.log(data);
        console.log("--")
        $scope.time = data.time;
        $scope.$apply(); //this call actiually should be placed in your service
});

编辑:

是的,嗯,你刚才没有为你的服务提供参数。改变服务方法与对应:

function($ rootScope){     var socket = io.connect('http://localhost:9090');

return {
    // replace with the code below
    on : function(type, cb) {//on: function(addCustomer){
        socket.on(type, cb);
    }
};

答案 1 :(得分:0)

您是否正确地从视图中调用控制器?您可以在此处查看更多信息AngularJS. How to call controller function from outside of controller component

您可以复制视图文件,以便我们查看。

此外,如果没有任何效果,我会尝试显式加载监听器,就像这样。

var app = angular.module('myApp');

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

    $scope.loadListener = function() {
        Console.log("Loading listener for event addCustomer")    
        socket.on('addCustomer', function(data) {
            console.log(data);
            console.log("--")
            $scope.time = data.time;
        });
    }

   $scope.testAlert = function() { alert("Method bound to controller") }
})

通过ng-click显式绑定loadListener方法到按钮,只是为了检查你的控制器是否真正绑定了。

通过ng-init还有另一种方法。你可以看一下这个帖子。 How to execute angular controller function on page load?

使用ng-init你可以做

<div data-ng-controller="CustomerCtrl" data-ng-init="loadListener()"></div>

只是为了确定您的控制器是否正确绑定