programing

AngularJS의 Run Block에서 약속을 기다리는 방법

easyjava 2023. 3. 10. 22:53
반응형

AngularJS의 Run Block에서 약속을 기다리는 방법

각도로 부트스트래핑하기 전에 로딩할 데이터가 필요합니다.이 때문에, 저는,run블록/이내run블록 서버에서 데이터를 로드하는 서비스에 대해 메서드를 호출합니다.이것은 비동기 호출이기 때문에 JavaScript는 실행에 더 가까워지고, 이로 인해 앱에 정의되지 않은 오브젝트가 발생합니다.

루트를 사용하고 있습니다만, 이 루트를 사용하는 경우는,resolve소유물.

누군가가 약속의 준비가 완료되기를 기다리는 방법에 대한 해결책을 제공할 수 있을까요?run블록?

편집:

주어진 답변 덕분에 수동으로 각도로 부트스트래핑하여 문제를 해결할 수 있었습니다.

$(document).ready(function () {
    $.ajax('/Data/GetDropdownData', {type:'POST'}).done(function (response) {
        app.run(['ListService',  function (ListService) {
            ListService.setData(response);
        }])

        angular.bootstrap(document, ["sma"]);
    })
})

이 SO 질문을 보면 Angular를 초기화하는 방법을 알 수 있습니다.비동기 데이터를 사용하는 JS 서비스.

다음은 Angular의 사용을 보여주는 질문의 플렁크러 예입니다.$http와 같은 JS 서비스는 설정을 로드한 후 추가 초기화를 수행합니다.

이 답변에서는 다음과 같이 DOM 로드를 기다리는 예를 설명하고 있습니다( 답변의 plunkr 예는 다음과 같습니다).

angular.element(document).ready(function() {
  angular.bootstrap(document);
});

제가 말씀드린대로라면 여기다가

수동 부트스트랩을 시도할 수 있습니다.

<script> 
   angular.element(document).ready(function() {
      angular.bootstrap(document); 
   });
</script>

물론 이 경우 컨트롤러와 각도 데이터 수집 방법을 사용할 수 없습니다.jQuery로 데이터를 로드하고 jquery 콜백에서 각도를 부트스트랩한 다음 jquery에서 얻은 데이터로 스코프 변수를 초기화해야 합니다.

유일한 해결책은 애플리케이션을 수동으로 부트스트랩하는 입니다."Delay Angular App Initialization" (각도 앱 초기화 지연) 및 "Manually bootstraping Angular" (수동 부트스트랩 각도)에서 도움말을 찾을 수 있습니다.Internet Explorer 비동기 로딩용 JS.

이전 문서에서 설명한 바와 같이 수동 부트스트랩을 실행하려면 다음 절차를 따릅니다.

angular.element(document).ready(function() {
  angular.bootstrap(document, ["myApp"]);
});

의 모든 기준을 반드시 삭제해 주십시오.ng-app당신의 안에서HTML자동 부트스트래핑을 정지합니다.

어플리케이션의 일부를 생략하지 않기 때문에 다른 솔루션을 사용할 수 있지만 로딩될 때까지 기다려야 합니다.

부트스트랩 디렉티브(트위터 부트스트랩에 관련되지 않음):

myApp.directive('myBootstrap', function() {
  return {
    scope: {
      promise: '=myBootstrap'
    },
    template: '<div ng-if="ctrl.isReady" ng-transclude></div>',
    controllerAs: "ctrl",
    transclude: true,
    controller: function($scope) {
      var ctrl = this;
      ctrl.isReady = false;

      //else an array of promises can be filled by a service
      $scope.promise.then(function() {
          ctrl.isReady = true;
      });
    }
  };
});

및 관련 plnkr :http://plnkr.co/edit/vx4aWS?p=preview

언급URL : https://stackoverflow.com/questions/21697598/how-to-wait-for-a-promise-in-a-run-block-in-angularjs

반응형