javascript - 在 AngularJS 中只运行一次某些代码

Question

我有一些代码只需要运行一次，但我不确定该代码属于哪里(服务？工厂？)

这是代码:

socket.on('recv chat', function (data){
    $("#chat").append(
        "<b>&lt;" + data.nick + "&gt;</b>: " +
        data.texto +
        "<br>"
    );
});

从代码中可以看出，它只是一个基本的聊天应用程序。我的整个网页有几个选项卡，其中一个选项卡是聊天选项卡。如果我将此代码放入聊天 Controller 中，它将在每个选项卡切换上执行，因此当有人发送消息时，它会被附加几次。

我应该把它放在哪里才能只执行一次？

Answer 1

您说它应该只执行一次，但大概您真正想要的只是它显示值。如果是这样，显而易见的是代码会更新模型，然后使用 Angular 的数据绑定(bind)进行显示。 ( Angular 一个好的经验法则是，除了尝试操作 DOM 的指令之外的任何地方都可能做错了)。

因此，放入 Controller 中的一些未经测试的代码可能是:

socket.on('recv chat', function (data){
    $scope.apply(function() {
        $scope.nick = data.nick;
        $scope.texto = data.texto;
    });
});

你的 html 里只有:

<div ng-show="nick"><b>&lt;{{nick}}&gt;</b>: {{texto}}</div>

我认为您需要将模型更新包装在 $scope.apply() 中，否则事件将不会在正确的 Angular 上下文中发生。

回复您的评论:

Controller 的每个新实例中是否都有一个新套接字？如果是这样，那就没有问题，因为旧的事件处理程序最坏的情况是更新旧的模型，并且当旧的套接字消失时应该消失。如果您在 Controller 之间重复使用套接字，那么我认为您想要定义一个服务来处理套接字，并且可以向该服务注册回调。