1

将 AngularJS 与 NodeJS 和 socket.io 一起使用时，我遇到了引导模式窗口的问题。我一直在谷歌搜索，似乎是有解决方案的问题，但由于某种原因，当我尝试与 Socket.io 一起实现它时它不起作用。我在两个不同的地方使用了模式——当我点击一个静态 div 时（完美运行），当我收到来自 webSockets 的消息时（只打开一次，然后什么也没有）。我想我的 JS 代码可能有问题，因为当我单击静态 div 时的模式工作正常，但我不知道。

我有一个地址，当访问此链接时，我正在通过 WebSockets 向客户端发送一些数据。客户端事件如下所示：

socket.on('patient', function(data){
    modalInstance = $modal.open({
    templateUrl: 'templates/patient.js',
    controller: 'patientModalCtrl',
    resolve: {
      details: function(){return data;}
    }
  });
});

和：

socket.on('alergy',function(data){
  modalInstance = $modal.open({
    templateUrl: "templates/alergy.js",
    controller: 'alergyModalCtrl'
  });
});

这两个都只工作一次，然后模态窗口停止出现。有趣的是，当我发出“过敏”，然后又是“病人”，我得到一个“过敏”窗口，然后是病人窗口，它下面的第二个“过敏”窗口。

发射看起来像这样：

app.get('/api/socket/hash/:hash', function(req, res){ 
    var hash = req.params.hash;
    //allergy
    if(hash === "3fDecCD"){
        connected_sockets[0].emit('alergy', {alergy: true});
        res.json({status: true});
    }
    //patient detail
    else if(hash === "Vc43Sf"){
        connected_sockets[0].emit('patient', {name: 'Jan', surname: 'Bjornstad'});    
        res.json({status: true});
    }
    else{
        res.json({status: false});
    }
});

我的模板如下所示：

<div class="modal-dialog">
<div class="modal-content">
    <div class="modal-header"></div>
    <div class="modal-body" style="background-color: #FFD1D1;">
        <h1 style="text-align: center; color: red;">Allergy!</h1>
        <h2 style="text-align: center; color: red;">The patient is allergic to opium!</h2>
    </div>
    <div class="modal-footer">
        <button class="btn btn-warning" ng-click="cancel()">Close</button>
    </div>
</div>
</div>

我正在使用 AngularJS 1.0.7，引导 CSS 2.3.1

4

1 回答 1

3

我会说您的套接字事件侦听器正在“在 AngularJS 世界之外”触发，因此 AngularJS 机器并没有开始执行其 2 路数据绑定“魔术”。准确地说，你没有进入 AngularJS $digest 循环，所以绑定没有更新，承诺没有解决等。

简单的解决方法是将对 AngularJS 特定代码的调用（这里 - 调用 $modal 服务）包装到Scope.$apply方法中，例如：

socket.on('alergy',function(data){

  $scope.$apply(function(){
    modalInstance = $modal.open({
      templateUrl: "templates/alergy.js",
      controller: 'alergyModalCtrl'
    });
  });

});
于 2013-11-05T11:03:17.433 回答