AngularJS에서 AJAX 콜백을 받은 후에 코드를 수행하는 방법에 대하여 알아봅니다. 먼저 생각할 수 있는 부분은 아래와 같이 3가지가 있습니다.

  • Promise를 넘겨주는 방법
  • $watch 서비스를 사용하는 방법
  • ng-if를 사용하는 방법
​​​​​​​
위 세가지 방법을 사용하여 가능합니다.

# Promise를 사용하는 방법
ajax에서 전달받은 promise를 return 받아 .then()에서 코드를 수행하는 방법입니다. 코드는 명확하지만 다소 길고 복잡할 수 있습니다. 수행하는 ajax()가 포함될 함수를 적용할 디렉티브의 스코픙 추가하여야하는 번거로움이 있습니다.



# $scope.watch를 사용하는 방법
이 방법은 모델, 데이터의 값이 변하는 경우에 watch()를 사용하여 콜백함수를 실행하는 방법입니다. 만약 ajaxData를 불러온다면 다음과 같이 사용할 수 있습니다. 만약 callbackfunc()을 실행한다면...

$scope.watch("ajaxData", function(newValue, oldValue) {
  if (newValue) {
    // 새로운 값이 있는 경우에만 콜백을 실행함
    callbackfunc();
​​​​​​​  }
}, true);




# ng-if를 사용하는 방법


이 방법은 약간의 꽁수처럼 보이지만 실제 가장 간단하게 사용할 수 있습니다. ajax를 통해 불러올 데이터 값을 ng-if 디렉티브에 추가합니다. 만약 ajax에서 ajaxData라는 데이터를 불러온다면 다음과 같이 사용합니다.

<custom-directive ng-if="ajaxData">
​​​​​​​    // code here
</custom-directive>

위와같이 사용할 수 있습니다.