2012-10-22 4 views
3

나는 이것을 Google API JavaScript Sample code을 AngularJS 앱으로 어떻게 변환 시킬지 궁금합니다. 나는 그것이 정말로 산뜻하다고 생각했다.Google API JavaScript 클라이언트에서 AngularJS를 사용하려면 어떻게해야합니까?

후속 조치로 Oauth 2.0에서 어떻게 작동합니까?

감사합니다.

은 내가 AngularJS와 종자 응용 프로그램을 사용하여 시도하고 이런 식으로 수정 -

// controller.js 

function SampleListCtrl ($scope, $http){ 
    $http. 
    jsonp('https://apis.google.com/js/client.js?onload=JSON_CALLBACK'). 
    success(function() { 
    alert('go go GO'); 
    function makeRequest() { 
    var request = gapi.client.urlshortener.url.get({ 
     'shortUrl': 'http://goo.gl/fbsS' 
    }); 

    request.execute(function(response) { 
     $scope.longUrl = response.longUrl; 
    }); 
    } 

    gapi.client.setApiKey('XXXX'); 
    gapi.client.load('urlshortener', 'v1', makeRequest); 

    $scope.samples = data.feed.entry; 
    }); 
}; 

그리고 index.html을에서

<div ng-controller="SampleListCtrl"> 
    <h4>{{ longUrl }}</h4> 
</div> 

RE : 로이 Truelove입니다의 끝이 나는 오류 콜백을 추가하는 시도 해고

error(function() { 
    console.log(JSON.stringify(arguments)); 
}); 

나는 무엇이 다시 올 것이므로 인수 객체를 검사했다. 콘솔의 출력은 -

{"1":0,"3":{"method":"JSONP","url":"https://apis.google.com/js/client.js?onload=JSON_CALLBACK"}} 

입니다. 경고는 콜백이 작동하지 않음을 의미하지 않습니다. 어떻게 작동시킬 수 있습니까? 더 나은 접근 방법이 있습니까?

+0

'성공'이 호출되지 않으면 '오류'라는 메시지가 표시 될 수 있으며 그 중에 잘못된 정보를 알려주는 정보가있을 것입니다. 만약 당신이 '각진'하는 방법에 대한 조언을 원한다면, 모든 google 관련 자료를 서비스로 옮기십시오. –

+0

팁을 주신 덕분에 @RoyTruelove 팁을 시도했지만 오류 메시지가 다시 나타나지 않는 것 같습니다. . 내 질문을 업데이트했습니다 – Peter

+0

'인수'는 어디에 정의되어 있습니까? –

답변

2

JSON을 요청하고 있지만 자바 스크립트 라이브러리를로드하고 있습니까? 나는 http 서비스가 그것을 위해 만들어진다고 생각하지 않는다. 각도를 부트 스트랩하기 전에 스크립트를로드하거나 스크립트 로더를 통합하여 스크립트를 동적으로로드해야합니다.

어쨌든 Angular Seed 템플릿을 사용하는 경우 index.html의 스크립트에 google API를 추가하거나 비동기 로더를 사용할 수 있습니다.

+1

당신이 옳았습니다. 샘플이 제시하는 것입니다. mvc 패턴에 반대 할 것입니다. 그래서 컨트롤러에이 기능을 강제 적용하려고합니다. 나는 틀릴 수도 있고 잘못된 길로 갈 수도 있습니다. 스크립트로드 결과를 $ scope에 바인드하거나 뷰에 표시하는 방법이 있습니까? 또는 컨트롤러의 함수를 'document.ready'와 같은 DOM 이벤트에 노출 시키십시오. – Peter

+0

@ 피터 왜 이것이 MVC 패턴에 어긋나는가? MVC 패턴은 애플리케이션의 구조를 설명합니다. –

+0

@Peter (너무 편집 속도가 느림) ... MVC 패턴은 스크립트 파일을 즉시로드할지 미리로드할지 여부가 아닌 응용 프로그램의 구조를 설명합니다. 애플리케이션에 스크립트 로더를 포함시켜 컨트롤러/서비스/지시문에 삽입 할 수 있습니다. –

관련 문제