在 AngularJS 项目中集成linkedIn API答案

【问题标题】：Integrate linkedIn API in AngularJS project在 AngularJS 项目中集成linkedIn API
【发布时间】：2018-09-19 06:35:32
【问题描述】：

我是 Angular 和 Javascript 的新手，我正在尝试集成 linkedIn API 以在我的 angularJS 项目中注册，使用linkedIn 数据自动填充一些表单。我已经对其进行了测试，但是同一个文件（在视图中）中的所有内容都像这样：

 <script type="in/login" data-onAuth="onLinkedInAuth">  </script>
 <script type="text/javascript">

   function onLinkedInAuth() {
     IN.API
     .Raw('/people/~:(id,firstName,lastName,formatted-name,num-connections,location,positions:(id,title,summary,start-date,end-date,is-current,company:(id,name,type,size,industry,ticker)),summary,email-address,specialties)?format=json')
     .method('GET')
     .result(getResults)
     .error(onError)

   };

   function getResults(result) {
     console.log(result);
     document.getElementById('full_name').value = result.formattedName || '';
     document.getElementById('local').value = result.location.country.code || '';
     document.getElementById('summary').value = result.summary || '';
     document.getElementById('email_address').value = result.emailAddress || '';

   }

   function onError(error) {
     console.log(error)
   }
 </script>

但现在我想做这一切，但使用服务和控制器，例如：

按 LinkedIn 按钮 -> 控制器 -> 服务 -> linkeInAPI -> 服务 -> 控制器 -> 视图（用数据填充表单，在这种情况下为多个视图）。

我已经创建了一个linkedInService.js，linkedInController.js。

问题是我真的不知道该怎么做，因为我对这一切都不熟悉。如果有人可以帮助我，那就太好了。谢谢。

【问题讨论】：

标签： javascript angularjs linkedin-api

【解决方案1】：

通常一个 angularjs 项目包含具有不同目的的各种文件。

这是一个 angularjs 项目的可能项目结构（取自this 站点）请不要说这个结构并不完美，还有更好的方法来构建你的 angularjs 代码（this 文章中的示例解释了这个真的很好）但这是一个简单的结构，你可以开始

app/
----- controllers/ --> controllers "glue" together html files with code logic
---------- mainController.js
---------- otherController.js
----- directives/
---------- mainDirective.js
---------- otherDirective.js
----- services/ --> services are reusable functions that you define that can get reused in controllers
---------- userService.js 
---------- itemService.js
----- js/
---------- bootstrap.js
---------- jquery.js
----- app.js
views/
----- mainView.html
----- otherView.html
----- index.html

因此一个可能的起点是将所有与linkedin相关的代码添加到LinkedinService中，然后从您的控制器中调用此LinkedinService：

  .service('LinkedinService', function ($http){

        this.loginWithLinkedin = function (){

         return IN.API
               .Raw('/people/~:(id,firstName,lastName,formatted-name,num-connections,location,positions:(id,title,summary,start-date,end-date,is-current,company:(id,name,type,size,industry,ticker)),summary,email-address,specialties)?format=json').method('GET')
        };

然后调用你的控制器之一：

LinkedinService.loginWithLinkedin().then(function (data) {
    console.log('linkedin login data:', data);

   })

我还看到您正在使用 document.getElementById('email_address').value = 更改 dom 这应该在 angularjs 中避免，因为它应该使用 scopes

【讨论】：