AngularJS 캡슐화의 자세한 예 $http.post()

이 글에서는 AngularJSencapsulation $http.post() 예제에 대한 정보를 자세히 소개하고 있습니다. 필요한 친구들은

$http.post() 예제를 자세히 캡슐화하는 AngularJS

를 참고하세요. 오랜 시간이 걸리지 않았습니다. 최근 ionic + AngularJS + cordovaframework를 사용하여 모바일 APP 프로젝트를 진행하는 동안 많은 문제에 직면했는데 그중 하나가 Ajax 캡슐화 문제였습니다.

사실 우리는 포장 문제에 대해 끊임없이 이야기해 왔습니다. 프로젝트마다 요구 사항이 다릅니다. 전형적인 예를 들자면, 제가 이 프로젝트를 진행하면서 처음에는 포장 문제를 고려하지 않았다는 이유로 비난을 받았습니다. 그리고 제 친구가 그걸 캡슐화해서 비난을 받았는데... 쑥스럽죠?

그러면 캡슐화 여부에 대한 문제를 어떻게 정의해야 할까요? 사실 이는 그다지 복잡한 문제는 아니지만, 최종적으로는 소득 비율의 문제이므로, 프로젝트 규모가 그리 크지 않다면, 프로젝트의 소득을 너무 많이 고려하는 것은 의미가 없습니다. 매우 낮으며 대규모 프로젝트의 경우 의미가 없습니다. 즉, 캡슐화가 없으면 잠재적 위험이 훨씬 높기 때문에 초기 투자 가치가 있습니다.

물론 이 문제는 저 같은 초보가 명확하게 설명할 수 있는 문제는 아닙니다. 오늘은 캡슐화를 고려한다면 어떻게 대처할 것인지에 대해 말씀드리겠습니다.

angularjs는 Ajax 요청을 처리하는 데 사용되는 http 서비스를 제공합니다. 여기서는 독자가 Anglejs를 알고 있다고 가정하므로 포스트 요청에 대한 캡슐화 처리 방법 주제로 곧장 이동하세요. 우선, 모든 사용자(프로젝트 팀원)의 개인화된 요구(특별한 처리가 필요한 상황)를 제외할 수 있는지 여부를 결정해야 합니다. 그렇게 할 수 없으면 인터페이스를 열어 게시 요청을 복원해야 하므로 http.post()를 반환하려면 종료가 필요합니다.

두 번째로, 응답이 올 때 각 사용자가 결과를 어떻게 처리하는지 고려해야 합니다. 성공 상황과 오류 상황 모두 처리 로직에 대한 입구를 제공해야 합니다.

위의 두 가지 사항을 바탕으로 서비스(공용 서비스)를 정의하고 사용자가 응답 콜백을 정의할 수 있도록 하는 myPost 메서드를 제공해야 한다는 대략적인 아이디어가 생겼습니다. 무료 처리 방법인 경우 원본 게시물()을 제공하세요. 다행스럽게도 js는 충분히 유연하기 때문에 다음과 같이 작성할 수 있습니다.

service('myHttpService', ['$http', function ($http) {
  var myHttpPost = function (url, data, successFn, errorFn) {
  }
  return {
    myHttp: function (url, data, successFn, errorFn) {
      return myHttpPost(url, data, successFn, errorFn);
  }
  }
}]);

위와 같이 내부적으로 정의된 메서드를 반환합니다. 이 메서드를 사용하면 사용자는 성공과 실패에 해당하는 콜백인 SuccessFn과 errorFn을 정의할 수 있습니다. , 사용자는 쉽게 다른 세부 사항에 대해 걱정하지 않고 데이터 처리 로직을 안전하게 미리 작성할 수 있습니다.

또한 사용자가 더 유연한 post()를 얻을 수 있도록 허용하므로 다음과 같이 구현합니다.

var httpPromise = $http.post(url, data, {timeout: 30000});
if (!angular.isDefined(successFn)) {
  return httpPromise;
}

사용자가 성공 콜백을 정의하지 않으면 이 캡슐화 계층은 마치 성공 콜백처럼 처리됩니다. Post()가 삭제되고 호출자가 처리합니다. 그리고 호출자가 미리 정의하고 싶다면 캡슐화에서 논리를 처리해야 합니다.

return httpPromise.then(
    function (response) {
     if (response.status) {
      return successFn(response);
     } else {
      /*其他处理*/
     }
    },
    function (error) {
     if (!angular.isDefined(errorFn)) {
      /*其他处理*/
     } else {
      return errorFn(error);
     }
    },
   function () {
    /*无论何总情况下都应该被执行的逻辑*/
   }
)

이렇게 하면 기본적으로 http.post()의 캡슐화가 완료됩니다. 한 가지 주의할 점이 있는데, 성공Fn을 처리할 때 콜백이 호출자에 의해 정의되었는지 확인하기 위해 angle.isDefined()를 사용한다면, 그렇지 않은 경우에는 호출자에게 처리 권한을 넘겨주게 됩니다. 정의되었으니 제가 대신 처리해 드리겠습니다. then() 메소드가 더 흥미롭습니다. 왜냐하면 http 메소드가 promise 객체를 반환할 때 응답은 then()을 통해 처리될 수 있기 때문입니다. promise.error() 다양한 응답 상태의 콜백을 처리하지만 then()을 사용하는 것이 완전한 응답 개체를 수신하는 반면, Success() 및 error()는 응답 개체를 구문 분석하므로 독자는 콘솔을 통해 구체적인 차이점을 출력할 수 있습니다. . 와서 구경해 보세요.

위 내용은 $http.post()를 간단하게 캡슐화한 것입니다. 간단하지만 대부분의 상황에 충분히 대처할 수 있으며 보다 자유로운 처리 방법을 유지합니다. . 이 패키지는 매우 유익했으며 다른 친구들에게도 도움이 되기를 바랍니다.

위 내용은 AngularJS 캡슐화의 자세한 예 $http.post()의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!