$resource 'get' 함수는 어떻게 AngularJS에서 동기적으로 작동합니까?

$resource 'get' 함수는 어떻게 AngularJS에서 동기적으로 작동합니까?

앵글을 보고 있었는데각도 리소스를 사용하여 Twitter에 연결하는 방법을 설명하는 JS 튜토리얼입니다.(비디오 튜토리얼)다음으로 컨트롤러 예시로 설정되어 있는 리소스를 나타냅니다.

$scope.twitter = $resource('http://twitter.com/:action',
    {action: 'search.json', q: 'angularjs', callback: 'JSON_CALLBACK'},
    {get: {method: 'JSONP'}});

이 튜토리얼에서는 다음 명령어를 사용하여 리소스에서 데이터를 가져오는 몇 가지 방법이 있음을 보여 줍니다.get첫 번째 방법은 콜백을 get 함수에 전달하는 것입니다.콜백은 ajax 요구가 반환된 후 결과로 호출됩니다.

$scope.twitter.get(function(result) {
    console.log('This was the result:', result);
});

나는 이 방법을 이해한다.내게는 완벽하게 이해가 된다.리소스는 웹에서 데이터를 가져올 수 있는 위치를 나타냅니다.get는 단순히 URL에 대해 Ajax 콜을 발신하고 json을 되돌려 json을 사용하여 콜백 함수를 호출합니다.그resultparam은 그 json입니다.

이것은 비동기 콜인 것이 분명하기 때문에 이해가 됩니다.즉, 후드에서 Ajax 콜이 기동하고, 콜 뒤에 오는 코드가 차단되지 않고, 계속 실행됩니다.그 후 xhr이 성공했을 때 콜백 함수가 호출됩니다.

그러면 튜토리얼에서는 훨씬 단순해 보이는 다른 방법을 보여 주는데, 어떻게 작동하는지 이해할 수 없습니다.

$scope.twitterResult = $scope.twitter.get();

그 밑에 있는 xhr은get비동기여야 하지만 이 행에서는 반환값을 할당합니다.get변수를 호출합니다(동기적으로 반환된 것처럼).

제가 이걸 이해하지 못하는 게 잘못된 건가요?어떻게 그것이 가능한가요?그게 효과가 있다는 게 정말 멋진 것 같아, 이해가 안 돼.

이해는 합니다.get아래에 있는 xhr이 꺼지고 비동기적으로 처리되는 동안 무언가를 반환할 수 있지만 코드 예를 직접 따라보면$scope.twitterResult는 후속 행이 실행되기 전에 실제 Twitter 콘텐츠를 가져옵니다.예를 들어 다음과 같이 입력합니다.console.log($scope.twitterResult)이 행의 직후에는 콘솔에 기록된 twitter의 결과가 표시됩니다.나중에 치환되는 일시적인 값은 표시되지 않습니다.

더 중요한 것은, 이것이 가능하기 때문에, 이 같은 기능을 활용하는 Angular 서비스를 어떻게 작성할 수 있을까요?Ajax 요청 외에도 자바스크립트에서 사용할 수 있는 비동기 호출이 필요한 데이터 저장소 유형이 있습니다. 이 스타일은 동기식으로 코드를 작성할 수 있으면 좋겠습니다.예를 들어 IndexedDB 입니다.Angular의 기본 제공 리소스가 어떻게 하고 있는지 이해할 수 있다면 시도해보고 싶습니다.

$resource는 동기화되지 않지만 이 구문은 다음과 같이 나타낼 수 있습니다.

$scope.twitterResult = $scope.twitter.get();

은, 에의 콜은 JS 에의 콜 에 행해집니다.twitter.get()를 즉시 반환하고, 그 결과는 빈 어레이가 됩니다. 그런 다음 비동기 호출이 종료되고 서버에서 실제 데이터가 도착하면 어레이가 데이터로 업데이트됩니다.각진JS는 단순히 반환된 어레이에 대한 참조를 유지하고 데이터를 사용할 수 있게 되면 이 참조를 입력합니다.

다음은 $resource 구현의 단편입니다.이 부분에서는 "위험"이 발생합니다.https://github.com/angular/angular.js/blob/master/src/ngResource/resource.js#L372

§ $resource (리소스) 문서에도 설명되어 있습니다.

됩니다($resource에 개체 ).isArray데이터가 서버에서 반환되면 기존 참조에 실제 데이터가 입력됩니다.일반적으로 리소스는 뷰에서 렌더링되는 모델에 할당되므로 유용한 트릭입니다.빈 객체가 있으면 렌더링되지 않습니다.서버에서 데이터가 도착하면 객체에 데이터가 채워지고 뷰가 자동으로 재렌더되어 새로운 데이터가 표시됩니다., 를 쓸 .

$q도 이 기술을 사용할 수 있습니다.다음과 같은 방법으로 일반 개체를 '지연 값'으로 변환할 수 있습니다.

var delayedValue = function($scope, deferred, value) {
    setTimeout(function() {
        $scope.$apply(function () {
            deferred.resolve(value);
        });
    }, 1000);
    return deferred.promise;
};

컨트롤러에서 사용하고, OP의 예에서 $scope.twitter.get()과 같은 효과를 얻습니다.

angular.module('someApp', [])
.controller('someController', ['$scope', '$q', function($scope, $q) {
  var deferred = $q.defer();
  $scope.numbers = delayedValue($scope, deferred, ['some', 'numbers']);
}]);

언급URL : https://stackoverflow.com/questions/11966252/how-does-the-resource-get-function-work-synchronously-in-angularjs