16

アプリでチャットを有効にするために socket.io を使用しており、サービスSocketServiceを使用してすべてのソケット処理を実行しています。メッセージが届いたら、サービスからコントローラーの機能をトリガーしてSocketService、UI にいくつかの変更を加えたいと思います。サービスからコントローラーの機能にアクセスするにはどうすればよいか知りたいです。サンプルコード:

.service('SocketService', function ($http,$rootScope,$q) {
  this.connect = function(){
    var socket = io();
    socket.on('connect',function(){
      // Call a function named 'someFunction' in controller 'ChatController'
    });
  }
});

サービスのサンプルコードです。

コントローラのコード

.controller('ChatController',function('SocketService',$scope){
  $scope.someFunction = function(){
     // Some Code Here
  }
});
4

3 に答える 3

2

これは古い質問ですが、別のオプションがあります。私は $broadcast に対して個人的な偏見を持っています - それはあまり「角度のある」とは感じません。私は自分のコードで明示的な呼び出しを行うことを好みます。

したがって、コントローラーにブロードキャストして別のダイジェスト サイクルをトリガーする代わりに、以下のように、コントローラー自体をサービスに登録することをお勧めします。コントローラーが同じサービスを利用する場合は、循環依存関係を導入しないように注意してください。これは controllerAs 構文で最適に機能するため、呼び出し元のサービスは $scope を気にする必要がありません。

はい、これは $broadcast よりも多くのコードですが、サービスがコントローラー全体 (メソッドとプロパティのすべて) に完全にアクセスできるようにします。

.service('SocketService', function ($http,$rootScope,$q) {
  var _this = this;    
  this.chatController = null;
  this.registerCtrlr = function (ctrlr) {
    _this.chatController = ctrlr;
  };
  this.unRegisterCtrlr = function () {
    _this.chatController = null;
  };

  this.connect = function(){
    var socket = io();
    socket.on('connect',function(){
      // Call chatController.someFunction if chatController exists
      if (_this.chatController) {
        _this.chatController.someFunction();
      }
    });
  };
});

.controller('ChatController',['SocketService', '$scope', function(SocketService, $scope){
  SocketService.registerCtrlr(this);
  //-- make sure controller unregisters itself when destroyed - need $scope for this
  $scope.$on('$destroy', function () {
    SocketService.unRegisterCtrlr();
  });
  this.someFunction = function(){
    // Some Code Here
  }
}]);
于 2016-12-20T14:59:47.957 に答える
0

この投稿が古いことは承知していますが、数年間 Angular JS を扱ってきたので、2 セントを差し上げたいと思います。私は個人的にこのアプローチを再考します。理想的には、AngularJS を使用してコントローラー/ディレクティブを変更してビュー モデルへのデータ転送を容易にし、最終的に HTML テンプレートを私が「ユーザー フレンドリーな」ビュー モデルと呼ぶものにバインドします。このビュー モデルは、ユーザーに表示する内容と一般的なタイミングを単純に反映する必要があります。このメソッドを使用すると、connectイベントが発生した瞬間に、サービスのデータにバインドする必要があるビュー モデルが、データが到着した瞬間にデータへの変更を反映します。

于 2019-08-02T13:29:27.683 に答える