2016-10-04 4 views
0

나는 응용 프로그램 (레일 응용 프로그램) 안에 앉아 작동 각 형태가 있습니다. 그것은 레일 서버에 요청을 보냅니다.각도 요청 받기

이 앱이 정상적인 요청을 받으면 페이지가 새로 고쳐집니다. 그러나 요청이 각도를 통해 전송되면 서버에서 요청을 볼 수는 있지만 페이지가 새로 고쳐지지 않습니다. (나는이 요청을 사용하여 데이터를 다시 가져올 수 있습니다.)

질문은 서버가 정상적으로 처리하고 페이지를 새로 고치려면 각도 형식으로 get 요청을 전달하는 방법입니까?

HTML :

<form ng-submit="submitForm()" style="margin-top:30px;"> 
    <h3>get request</h3> 
    <button type="submit" class="btn btn-primary">Get</button> 
</form> 

app.js 컨트롤러 :

$scope.submitForm = function(){ 
    posts.factorySubmit(); 
}; 

app.js 공장 얻을 기능 :

o.factorySubmit = function() { 
     $http.get('http://localhost:8080/clients'); 
}; 

--Side 노트 - 나는 GET 요청을 만드는 경우 , 응용 프로그램에서 각도 컨텍스트 외부에서 정규 자바 스크립트와 함께, 나는 예상 동작을 얻을 페이지를 새로 고칩니다.

+0

'$ http.get'은 AJAX 호출이고 페이지를 새로 고치지 않습니다. 하지만 일반적으로 각도 앱에서 페이지를 새로 고침하고 싶지는 않습니다. 왜 그것을 다시로드하고 싶습니까? – nagyf

+0

GET에서 데이터를 표시하기 위해 다시로드 하시겠습니까? – Wandrille

+0

레일에서 일어나는 일련의 로직을 처리하기 위해 서버가 필요하며 새로운 로직으로 페이지를 다시로드하십시오. 기본적으로, 나는 그 모든 논리를 각도로 다시 쓰고 싶지 않다. – HoosierCoder

답변

4

당신은 훌륭한 연습 인 공장에서 $ http를 감쌌다. 당신이하지 않는 것은 응답을 포착하는 것입니다.

o.factorySubmit = function() { 
     // Add a return here 
     return $http.get('http://localhost:8080/clients'); // This call returns a promise 
}; 

그럼 당신은이 기능이 ... 호출 할 때 각도에 대한

$scope.submitForm = function(){ 
    posts.factorySubmit().then(function(response) { 
    $scope.requests = response.data; // This is where you get your response 
    }, 
    function(response) { 
    // This is your error handling 
    }); 
}; 

멋진 점은 변화를 감지하고 자동으로 페이지를 업데이트 할 것입니다. 변경 사항에 대한 응답으로 내부적으로 호출되는 다이제스트주기가 있습니다. 내장 된 $http 공급자를 사용하고 있으므로 $scope 변수를 업데이트하면 새로 고침됩니다.

+0

그래서 편집을 맡았습니다. 각이받는 데이터가 새로 고침됩니다. 문제는 여전히 페이지를 새로 고치지 않는다는 것입니다. 응용 프로그램이 레일 라우터를 쳐서 요청을 받으면 논리를 통과하도록 새로 고침해야합니다. ( – HoosierCoder

+0

레일 로직이 수행해야 할 작업은 무엇입니까? 아마도 전화를 받으면 서버를 수행하기 위해 게시 할 수 있습니다 -side logic. 아마도 ASP.NET MVC와 AngularJS를 섞기 시작했을 때와 같은 문제에 직면했을 것입니다. – Zach

+0

get 요청에서 params를 받아 데이터를 구문 분석하고 차트를 그립니다 – HoosierCoder

0

각도는 단일 페이지 응용 프로그램 용으로 작성된대로 페이지를 새로 고치지 않아야합니다. 수동으로 페이지를 새로 고침 할 경우, $get 요청의 성공 함수에서

$scope.submitForm = function(){ 
    posts.factorySubmit().success(function(){ 
    $route.refresh(); 
    }); 
}; 

를 사용합니다. 컨트롤러에 $route을 주입해야합니다.

+0

나는 이것을 시도했지만, $ route를 삽입하자마자 어떤 이유에서든 응용 프로그램이 중단됩니다. 이 컨트롤러 코드가 올바르게 보이십니까? '.제어기 ('MainCtrl'[ \t '$ 범위' \t '$ 행' \t '포스트' \t 함수 ($ 범위, $ 경로, 포스트) { \t $ scope.posts의 = 소식. 포스트; \t $ scope.submitForm = 함수() { \t \t posts.factorySubmit()의 성공 (함수() {$ \t \t의 route.refresh(); \t \t}). \t} \t} ]) – HoosierCoder

+2

$ http 문서에 따르면 .success()는 이제 비추천입니다. https://docs.angularjs.org/api/ng/service/$ 대신 표준 .then() 콜백을 사용하십시오. http –