控制器 $scope 属性不更新（套接字连接）

Question

我想让我的 angular 控制器由与 websockets 连接的工厂更新。

工厂：

function($rootScope, mySocketFactory) {
    mySocketFactory.setHandler('message', function(event) {
        $rootScope.$apply(function() {
            Factory.msg = event.data;
        });
        console.log('factory', Factory.msg);
    });

    var Factory = {};
    Factory.msg = 'init';
    return Factory;
}

控制器：

function ($scope, myFactory) {
    console.log(myFactory.msg);

    $scope.msg = myFactory.msg;
}

部分:

<div data-ng-controller="StatusBarController" class="col-lg-12">
    {{msg}}
</div>

如果工厂通过 message 事件获取数据 console.log('factory', Factory.msg); returns 更新值，但控制器不应用更改并坚持 init 数据.我在这里做错了什么？

注意：我用数组而不是字符串尝试了同样的例子，结果成功了！？首先我认为这可能是因为字符串不是通过引用传递的，但由于我们在 JS 世界中，它们是。

Answer 1

您可以创建一个 getter 函数表单工厂，而不是绑定属性，它将 return msg 属性值，{{msg()}} 上的 html 将在每个摘要周期得到评估，因为当您收到 message.

时，您会从您的服务中运行

工厂

var Factory = {};
Factory.getMsg = function(){
     return Factory.msg;
};
return Factory;

控制器

function ($scope, myFactory) {
    $scope.msg = myFactory.getMsg;
}

HTML

<div data-ng-controller="StatusBarController" class="col-lg-12">
    {{msg()}}
</div>

更新

我建议您遵循 dot rule 而不是上述方法，它需要声明 object 并且该对象将保留属性 Factory.data = {msg ： 'init'};`。更新工厂变量后，它会自动更新其在控制器变量中的引用。

工厂

function($rootScope, mySocketFactory) {
    mySocketFactory.setHandler('message', function(event) {
        $rootScope.$apply(function() {
            Factory.data.msg = event.data;
        });
        console.log('factory', Factory.msg);
    });

    var Factory = {};
    Factory.data = { msg : 'init'};
    return Factory;
}

控制器

function ($scope, myFactory) {
    $scope.info = myFactory.data;
}

HTML

<div data-ng-controller="StatusBarController" class="col-lg-12">
    {{info.msg}}
</div>

控制器 $scope 属性不更新（套接字连接）

Controller $scope attribute does not update (socket connection)

javascript

angularjs

sockets

angularjs-service

angularjs-factory