2014-05-16 2 views
0

각도를 배우려고하는데 문제가 생겼습니다. 아이템 이름, 가격 및 이미지를 MongoDB에 제출하는 양식이 있습니다. 내 노드 경로에서 res.json을 응답으로 사용하고 있습니다. jQuery POST 메서드를 사용하는 동안 페이지에 머물러서 콘솔이나 변수 등에 데이터를 반환 할 수 있습니다. 각형 POST 메서드로 변경했을 때 실제로 JSON 응답이 포함 된 새 페이지로 이동합니다. 이것은 물론 내가 원하는 것이 아닙니다. 데이터베이스를 업데이트하고 새 데이터를 얻고 페이지를 떠나지 않고 모델을 업데이트하려고합니다.노드 서버에 각도 POST

이것은 내 노드 경로입니다.

router.post('/items/add', function(req, res){ 
    // handle image upload 
    fs.readFile(req.files.image.path, function (err, data) { 

     var imageName = req.files.image.name 

     /// If there's an error 
     if(!imageName){ 

      console.log("There was an error") 
      res.redirect("/"); 
      res.end(); 

     } else { 
      var newPath = '/uploads/' + imageName; 
      /// write file to uploads/fullsize folder 
      fs.writeFile(newPath, data, function (err) { 

      }); 
     } 
    }); 

    // save info to database 
    var newItem = new Item({ 
     name : req.param('Name'), 
     price : req.param('Price'), 
     image : req.files.image.name 
    }); 
    newItem.save(function(err){ 
     if(err){ 
      console.log(err); 
     } else{ 
      Item.find(function(err, items){ 
       if (err){ 
        return console.log(err); 
       } else{ 

        res.json({ 
         items : items 
        }); 
       } 
      }); 
     } 
    }); 
}); 

이 내 각 코드 : 데이터가 올바르게 게시됩니다

var allItems = angular.module('allItems', []); 

allItems.controller('allItemsCtrl', function ($scope, $http) { 
    $scope.updateItems = function(){ 
     $http.get('/allItems').success(function(data){ 
      $scope.theitems = data.allItems; 
     }); 
    }; 

    // The culprit 
    $scope.postItems = function(){ 
     $scope.formData = {}; 
     $http.post('/items/add', formData).success(function(data){ 
      $scope.theitems = data.allItems; 
     }); 
    }; 

    $scope.updateItems(); 
}); 

그러나 나는 그것이 AJAX 포스트처럼 행동하고 페이지를 떠나하고자합니다. 어떻게해야합니까?

+1

진짜 문제는 지구에 ** 당신은 각도'$ http.post()'요청을 위해 관리했던 방법처럼 양식에 ngSubmit를 사용하지 ** 아약스 요청처럼 행동! '$ scope.postItems()'를 어떻게 호출하고 있습니까? – gkalpak

+0

하! 하아! LOL : D 끔찍한 질문 하하하하 @ExpertSystem – Dalorzo

+0

당신은 바로 작동해야하기 때문에 내가 제출을 사용하고 있지만, 나는 틀린 일을해야만합니다. –

답변

2

<form method="post" action="http://yoursite.com/items"> 
    <input type="text"/> 
    <button type="submit">Submit</button> 
</form> 

같은 전송 버튼으로 실제 HTML 양식이있는 경우 다음이 페이지에 관계없이 당신이 당신의 자바 스크립트에서 일을 결국 무엇을 새로 고침 할 것입니다. 의미 적으로 올바르도록 HTML 양식 요소를 유지하지만 메서드 또는 작업 특성은 필요하지 않습니다. 대신이

<form ng-submit="postItems()"> 
    <input type="text"/> 
    <button type="submit">Submit</button> 
</form> 
관련 문제