Question

所以我有一个应用程序，只需点击gmail api，然后授权，获取电子邮件ID列表，然后获取这些电子邮件。我用简单的旧java脚本编写，但我想将其转换为Angular。我看了很多视频并阅读了很多文档，但我发现这些视频从未像这样做过。我将如何构建这样的结构？我可以使用工厂吗？或者我可以在控制器方法中删除所有js吗？

 function handleClientLoad() {
    gapi.client.setApiKey(apiKey);
    window.setTimeout(checkAuth,1);
  }
  function checkAuth() {
    gapi.auth.authorize({client_id: clientId, scope: scopes, immediate: true}, handleAuthResult);
  }
  function handleAuthResult(authResult) {
    var authorizeButton = document.getElementById('authorize-button');
    if (authResult && !authResult.error) {
      authorizeButton.style.visibility = 'hidden';
      makeApiCall();
      getMessages();
    } else {
      authorizeButton.style.visibility = '';
      authorizeButton.onclick = handleAuthClick;
    }
  }
  function handleAuthClick(event) {
    gapi.auth.authorize({client_id: clientId, scope: scopes, immediate: false}, handleAuthResult);
    return false;
  }
  // Load the API and make an API call.  Display the results on the screen.
  function makeApiCall() {
    gapi.client.load('plus', 'v1', function() {
      var request = gapi.client.plus.people.get({
        'userId': 'me'

      });

      console.log(request);
      request.execute(function(resp) {
        var heading = document.createElement('h4');
        var image = document.createElement('img');
        image.src = resp.image.url;
        heading.appendChild(image);
        heading.appendChild(document.createTextNode(resp.displayName));
        document.getElementById('content').appendChild(heading);
      });
    });
  }
                           };
 function getMessages() {
   gapi.client.load('gmail', 'v1', function() {
   var request = gapi.client.gmail.users.messages.list({'userId' :'me',
   labelIds: ['INBOX'],
   });
  request.execute(function(resp) {
    var content = document.getElementById("message-list");
     angular.forEach(resp, function(value, key) {
          angular.forEach(value, function(value, key) {
            var newEmail = gapi.client.gmail.users.messages.get({'userId': 'me','id': value.id ,'format':'metadata', 'metadataHeaders': ['subject','from','to','date']});
                newEmail.execute(function(resp) {
                    var emailw = resp;
                    content.innerHTML += emailw.payload.headers[0].name + "    "; 
                    content.innerHTML += emailw.payload.headers[0].value + "<br>"; 
                    content.innerHTML += emailw.payload.headers[1].name + "    ";
                    content.innerHTML += emailw.payload.headers[1].value + "<br>"; 
                    content.innerHTML += emailw.payload.headers[2].name + "    "; 
                    content.innerHTML += emailw.payload.headers[2].value + "<br>"; 
                    content.innerHTML += emailw.payload.headers[3].name + "    "; 
                    content.innerHTML += emailw.payload.headers[3].value + "<br><br><br><br><br><br><br><br>"; 
                });
            });
        });
    });
});
   }

Answer 1

最快的方法是将其包装到服务/工厂中，并仅向消费者公开所需的功能。请注意，您可能不必导出所有功能，这样可以提供更清洁的服务。

angular.module('myApp').factory('myGapi', function() {

  // Paste functions here  

  function handleClientLoad() {}

  function makeApiCall() {}

  // ...

  return {
    // Expose the function to the consumers
    makeApiCall: makeApiCall
  };
});

// Consume the myGapi service    
angular.module('myApp').controller('MyController', function($scope, myGapi) {

  $scope.click = function() {
    myGapi.makeApiCall();
  };

});

将普通js转换为角度语法的快捷方法？

1 个答案: