V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
97world
V2EX  ›  程序员

使用 AngularJS 整合腾讯云 SDK 遇到的问题, 在 Controller 里面调用 webim.login(loginInfo, listeners, options, function() {})方法并没有执行相应的监听事件

  •  
  •   97world · 2016-08-23 00:14:15 +08:00 · 3539 次点击
    这是一个创建于 3022 天前的主题,其中的信息可能已经有所发展或是发生改变。

    一个全局变量 listeners

    function onConnNotify() {console.log('onConnNotify4ward');}
    
    function jsonpCallback() {console.log('jsonpCallback4ward');}
    
    function onMsgNotify() {console.log('onMsgNotify4ward');}
    
    function onBigGroupMsgNotify() {console.log('onBigGroupMsgNotify4ward');}
    
    function onGroupSystemNotifys() {console.log('onGroupSystemNotifys4ward');}
    
    function onGroupInfoChangeNotify() {console.log('onGroupInfoChangeNotify4ward');}
    
    function onFriendSystemNotifys() {console.log('onFriendSystemNotifys4ward');}
    
    function onProfileSystemNotifys() {console.log('onProfileSystemNotifys4ward');}
    
    var listeners = {
      "onConnNotify": onConnNotify,//监听连接状态回调变化事件,必填
      "jsonpCallback": jsonpCallback,//IE9(含)以下浏览器用到的 jsonp 回调函数,
      "onMsgNotify": onMsgNotify,//监听新消息(私聊,普通群(非直播聊天室)消息,全员推送消息)事件,必填
      "onBigGroupMsgNotify": onBigGroupMsgNotify,//监听新消息(直播聊天室)事件,直播场景下必填
      "onGroupSystemNotifys": onGroupSystemNotifys,//监听(多终端同步)群系统消息事件,如果不需要监听,可不填
      "onGroupInfoChangeNotify": onGroupInfoChangeNotify,//监听群资料变化事件,选填
      "onFriendSystemNotifys": onFriendSystemNotifys,//监听好友系统通知事件,选填
      "onProfileSystemNotifys": onProfileSystemNotifys//监听资料系统(自己或好友)通知事件,选填
    };
    

    在 Controller 里面调用 webim.login(), 但是监听事件没有执行.

    angular.module('app')
      .controller('AppCtrl', ['$scope', '$translate', '$localStorage', '$window', 
        function(              $scope,   $translate,   $localStorage,   $window ) {
            
          function webimLogin() {
            console.log('webimLogin', loginInfo, listeners, options);
            webim.login(
              loginInfo, listeners, options,
              function (resp) {
                console.log('resp', resp);
                loginInfo.identifierNick = resp.identifierNick;//设置当前用户昵称
              },
              function (err) {
                alert(err.ErrorInfo);
              }
            );
          }
          webimLogin();
    
      }]);
    

    但是使用 jQuery 为一个按钮绑定 click 事件, 再在这个 click 事件去调用 webim.login(), 则没有问题.

    $('#btn-login').click(function (){ 
      function webimLogin() {
        console.log('webimLogin', loginInfo, listeners, options);
        webim.login(
          loginInfo, listeners, options,
          function (resp) {
            console.log('resp', resp);
            loginInfo.identifierNick = resp.identifierNick;//设置当前用户昵称
          },
          function (err) {
            alert(err.ErrorInfo);
          }
        );
      }
      webimLogin();
    });
    

    感觉像是作用域的问题, 不知道大家用 AngularJS 整合第三方 SDK 的时候, 是如何解决这类问题的?

    4 条回复    2016-08-23 15:33:35 +08:00
    Fleey
        1
    Fleey  
       2016-08-23 07:31:59 +08:00
    ....我老感觉是你 angularJs 写的问题,我还是第一次看人这样写。你前端部分绑定 ng-click 了么
    beginor
        2
    beginor  
       2016-08-23 10:35:37 +08:00 via Android
    有些浏览器会奇葩的拦截自动加载数据的请求, 把 wenimLogin() 这句放到 $timeout 里面试试看。

    此外, ng 整合第三方类库时, 如果需要更新 dom , 请使用 directive , 否则请使用 service 或者 provider 。
    97world
        3
    97world  
    OP
       2016-08-23 13:18:29 +08:00
    @beginor 如你所说, 还真的是加一个$timeout 就可以了, 但是我不明白, 这真的是被浏览器拦截了?
    beginor
        4
    beginor  
       2016-08-23 15:33:35 +08:00 via Android
    只能说某些奇葩的浏览器会拦截,不是所有的浏览器都会。也可以用 ng 1.5 的 component ,这个 component 有生命周期的概念, 可以在 $onInit 方法中做任何事情, 想必已经考虑了这种情况。
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   950 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 24ms · UTC 20:30 · PVG 04:30 · LAX 12:30 · JFK 15:30
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.