gpt4 book ai didi

angularjs - 可以更新各种范围的 Angular 和套接字

转载 作者:行者123 更新时间:2023-12-03 11:56:54 26 4
gpt4 key购买 nike

我有一个多方面的应用程序,它允许用户通过 socket.io 进行实时通信。到现在为止还挺好。我已经为 socket.io 编写了一个非常简单的工厂,而且效果也很好。

我需要拥有“ Eureka ”时刻的是如何让我的套接字监听每个 Controller 并更新应用程序的各个部分。

例如,我的功能:

socket.on('message', function(data) {});

当前在 ChatCtrl 范围内。因此,如果用户在“SettingsCtrl”中说,则套接字不会收到消息。

另外,我想实现诸如在联系人列表中标记未读消息数量之类的功能。

所以我真正需要做的是有一个“全局”监听的套接字,然后更新各种 Controller 的范围。

只是我应该研究的内容的指针会很棒。

最佳答案

因为您需要您的套接字在任何地方进行监听,这是 $rootScope 的完美用例.所有非隔离作用域都从 $rootScope 继承属性。我已经把这个 plunker我希望有助于演示如何使用 $rootScope 在各种 View 和 Controller 中持久保存您的套接字。

如果您查看 app.js,您将看到使套接字成为全局的主要部分。在config函数之后,有一个注入(inject)$rootScope和socket的run函数:

// add the global socket handler
app.run(['socket', '$rootScope', function(socket, $rootScope) {

// add an object to rootscope that will expose variables and functions
$rootScope.io = {
chat: '',
say: '',
emit: function() {
socket.emit('new message', this.say);
this.chat += 'me: ' + this.say + '\n';
this.say = '';
}
};

// add additional socket functions to listen for replies, etc.
socket.on('reply', function(data) {
$rootScope.io.chat += data + '\n';
})

socket.on('clear', function() {
$rootScope.io.chat = '';
});

}]);

现在这个 io 对象可用于所有范围。在 plunker 中,您可以在各种 View 之间切换。即使一个新的 Controller 和 html 部分正在初始化,套接字和与之相关的所有数据仍然存在。

但是,这并不意味着您必须使所有逻辑都可以全局访问。例如,view2 的 Controller 仍然可以为该特定 Controller 注入(inject)套接字、监听和发出事件。 view2 跟踪未读消息,并允许执行其他命令,例如清除聊天或发送 ping

关于angularjs - 可以更新各种范围的 Angular 和套接字,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24016526/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com