2016-10-10 4 views
0

MEAN을 사용하여 간단한 웹 응용 프로그램을 만드는 방법을 배우는 온라인 자습서를 작성 중입니다. 아래 코드는 JSON 개체의 지정된 컬렉션을 편집하기위한 코드입니다 (비디오는 JSON 개체입니다) 여기) 컬렉션은 /api/videos 입니다. href="/#/video/{{video._id}}을 클릭해야합니다. form.html으로 이동하면 JSON 개체의 'title'및 'description'매개 변수를 편집 할 수있는 옵션이 있습니다. 이해 수없는 것 무엇 은 다음과 같습니다이 코드의 워크 플로를 이해할 수 없습니다.

A) 내가 직접에서 ID를받을 수 없어 href="/#/video/{{video._id}} 오전 때문에 문제가 아래이 (전체 코드는)

var Videos = $resource('/api/videos/:id', { id: '@_id' }, 
     { 
      update: { method: 'PUT' } 
     }); 

필요합니다 왜 워크 플로우입니다 Whait의 URL

var Videos=$resource('api/videos) 

Videos.get({ id: $routeParams.id }, function(video){ 
      $scope.video = video; 
     }); 

b)는 요청이 정확히 만들어 (즉 때 router.get (IS) 나에 따르면 router.put() 만든 요청) 때 때 저장 클릭 버튼을 누르면 컨트롤러가 입력 요청을합니다. o API가 있지만 router.get() 요청이 언제 이루어지고 있는지 알 수 없다.

나는 명시 적이며 모호한 문서를 읽으려고하지만 워크 플로우를 설명하지는 않는다. 더 나은 이해를 얻으려면 무엇을 읽어야합니까?

AngularJS docs for $resouce, $에 따르면,이 이것은 API 엔드 포인트 코드

router.get('/:id', function(req,res){ 
    var collection =db.get('videos'); 
    collection.findOne({_id: req.params.id},function(err,video){ 
     if(err) throw err; 
     res.json(video); 
    }); 
}); 
router.put('/:id', function(req, res){ 
    var collection=db.get('videos'); 
    collection.update({_id:req.params.id}, 
    {title: req.body.title, 
    description: req.body.description 
    }, 
    function (err,video) 
    {if (err) throw err; 

     res.json(video); 
    }); 
}); 

답변

1

음이

app.controller('EditVideoCtrl', ['$scope', '$resource', '$location', '$routeParams', 
    function($scope, $resource, $location, $routeParams){ 
     var Videos = $resource('/api/videos/:id', { id: '@_id' }, 
     { 
      update: { method: 'PUT' } 
     }); 

     Videos.get({ id: $routeParams.id }, function(video){ 
      $scope.video = video; 
     }); 

     $scope.save = function(){ 
      Videos.update($scope.video, function(){ 
       $location.path('/'); 
      }); 
     } 
    }]); 

컨트롤러 코드가

<h1>Add a Video</h1> 

<form> 
    <div class="form-group"> 
     <label>Title</label>   
     <input class="form-control" ng-model="video.title"></input> 
    </div> 
    <div> 
     <label>Description</label> 
     <textarea class="form-control" ng-model="video.description"></textarea> 
    </div> 
    <input type="button" class="btn btn-primary" value="Save" ng-click="save()"></input>  
</form> 

form.html 코드 리소스 :

RESTful 서버 측 데이터 소스와 상호 작용할 수있게하는 리소스 객체를 만드는 팩토리입니다.

즉 RESTful 서비스 작업의 바로 가기입니다. 아래 코드는 REST 작업을보다 쉽게 ​​수행 할 수 있도록 API 엔드 포인트와 인터페이스를 작성합니다. 이이 있으면 :

var User = $resource('/user/:userId', {userId:'@id'}); 

이 작업을 수행하는 것이 훨씬 쉽습니다 :

User.get({userId:123}, function(user) { 
    user.abc = true; 
    user.$save(); 
}); 

편안하고 표준이며, $resource이 표준 API 년대의 소비의 각도의 구현이기 때문입니다. 그의 내부에서, 당신이 conigured 및 choosed 작업에 따라 프로퍼 헤더와 방법으로 비동기 요청이 이루어집니다.

관련 문제