원할 때 각도 약속이 해결되지 않습니다.

Question

원할 때 Angular가 약속 한대로 해결할 수 있습니다. 아래 코드를 볼 때, 먼저 KeyDataFromServer()를 검색하고 모든 키가 서버에서로드 된 후에 만 ​​나머지 명령을 실행하려고합니다. 그러나 아래의 설정으로 먼저 다른 명령이 실행되어 내보기에 표시되고 서버에서 데이터가로드되면 서버 데이터가 포함됩니다.

내가 뭘 잘못하고 있니?

// 컨트롤러 (주입 $ q를하고 KeyGenerationService)

$scope.KeyData = null; 

    var defer = $q.defer(); 
    var promise = defer.promise; 

    promise 
    .then(
    function() { 

     var KeyData = { 
      Server:   KeyGenerationService.getKeyDataFromServer() 
     }; 

     return KeyData 

    }) 
    .then(
    function(KeyDataFromFunction1) { 

     var KeyData = { 
      KeyDateGroup:  KeyGenerationService.generateKeyDateGroup(), 
      KeyID:   KeyGenerationService.generateKeyID(), 
      Server:   KeyDataFromFunction1.Server 
     }; 

     return KeyData 

    }) 
    .then(
    function(KeyDataFromFunction2){ 

     $scope.KeyData = KeyDataFromFunction2; 

    }) 
    .catch(
    function(error){ 
     window.alert(error); 
    }) 


    defer.resolve($scope.KeyData) 

// 공장

.factory('KeyGenerationService', function($q, fbutil) { 

     // returns 
     return { 

      generateKeyDateGroup: function() { 

       var today = new Date(); 
       var d = today; 
       var dd = today.getDate(); 
       var mm = today.getMonth()+1; //January is 0! 
       var yyyy = today.getFullYear(); 
       if(dd<10) { 
       dd='0'+dd 
       } 
       if(mm<10) { 
       mm='0'+mm 
       } 
       today = yyyy+''+mm+''+ dd; 

       return today; 

      }, 

      generateKeyID: function() { 

       var d = new Date().getTime(); 
       var uuid = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) { 
       var r = (d + Math.random()*16)%16 | 0; 
       d = Math.floor(d/16); 
       return (c=='x' ? r : (r&0x3|0x8)).toString(16); 
       }); 

       return uuid; 

      } 

      getKeyDataFromServer: function() { 


       return fbutil.syncArray('keys'); 

      } 

     } // return 


    }) // .factory KeyGenerationService 

Answer 1

당신이 약속을 사용하는 방법이 약간 잘못되었습니다. 컨트롤러가 약속을 받아야하는 컨트롤러이지만 비동기 호출은 해당 비동기 호출을 생성, 해결 및/또는 거부해야합니다.

주요 알려지지 않은 부분은 fbutil.syncArray입니다. 이름에서 판단하는 동기식 호출 인 것처럼 get/post 요청은 일반적으로 비동기식 인 경향이 있으며 다른 것을 반환합니다. 따라서 중요한 질문은이 호출이 무엇을 반환하는지입니다.

이 서비스는 약속을 만들기위한 책임이 될 수 있도록이 문제를 리팩토링하려면이 작업을 수행 할 수 있습니다

컨트롤러 코드로 단순화 될 수

.factory('KeyGenerationService', function($q, fbutil) { 

     // returns 
     return { 

      // This is a synchronous function and doesn't need promises 
      generateKeyDateGroup: function() { 

       var today = new Date(); 
       var d = today; 
       var dd = today.getDate(); 
       var mm = today.getMonth()+1; //January is 0! 
       var yyyy = today.getFullYear(); 
       if(dd<10) { 
       dd='0'+dd 
       } 
       if(mm<10) { 
       mm='0'+mm 
       } 
       today = yyyy+''+mm+''+ dd; 

       return today; 

      }, 

      // This is a synchronous function and doesn't need promises 
      generateKeyID: function() { 

       var d = new Date().getTime(); 
       var uuid = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) { 
       var r = (d + Math.random()*16)%16 | 0; 
       d = Math.floor(d/16); 
       return (c=='x' ? r : (r&0x3|0x8)).toString(16); 
       }); 

       return uuid; 

      } 

      // This is likely an asynchronous function and will need to create/return promises 
      getKeyDataFromServer: function() { 

       var defer = $q.defer(); 

       // If fbutil.syncArray was synchronous you can use this 
       var result = fbutil.syncArray('keys'); 
       defer.resolve(result); 

       // However, I think the fbutil.syncArray should really be asyncronous, which means it would either use a promise itself or use callbacks. If using promises, the following is how it might look: 

       //fbutil.syncArray('keys).then(function(result){ 
       // defer.resolve(result); 
       //}); 

       return defer.promise 

      } 

     } // return 


    }) // .factory KeyGenerationService 

:

$scope.KeyData = null; 

KeyGenerationService.getKeyDataFromServer().then(
    // Success handler 
    function(result){ 
     $scope.KeyData = { 
      KeyDateGroup:  KeyGenerationService.generateKeyDateGroup(), 
      KeyID:   KeyGenerationService.generateKeyID(), 
      Server:   result 
     }; 
    }, 
    // Error handler 
    function(error){ 
     window.alert(error); 
    } 
);