Question

我正在尝试发布一些电影数据，同时使用$ http.post它会显示新记录被插入但是在列出电影时它只显示id而不是其他字段。

这是我的app.js，

myApp.controller("addMovieCtrl",function($scope,$http,$window,$mdToast,$mdDialog){
		$scope.submitForm = function(){ 
		$scope.movies = [];
        $scope.movies.push({
			title		: $scope.mtitle,
			director	: $scope.mdirector,
			genre		: $scope.mgenre,
			releaseYear	: $scope.myear,
		});
        $http({
          method  : 'POST',
          url     : 'http://movieapp-sitepointdemos.rhcloud.com/api/movies/',
          data    : $scope.movies, //forms user object
          headers : {'Content-Type': 'application/x-www-form-urlencoded'} 
         })
          .success(function(data) {
              	$mdToast.show(
      			$mdToast.simple()
        			.textContent(data.message)
        			.position($scope.getToastPosition())
        			.hideDelay(2000)
    			);             
          }).error(function(err){
          		$mdToast.show(
      			$mdToast.simple()
        			.textContent(err)
        			.position($scope.getToastPosition())
        			.hideDelay(2000)
    			); 
          });
		$scope.mtitle = ''; //clear the input after adding
		$scope.mdirector = '';
		$scope.mgenre = '';
		$scope.myear = '';
	};
  });

这是我的观看页面，

  <body ng-controller="addMovieCtrl" ng-app="myApp">    
    <div>
    <div class="edit_data">
      <form class="form-register" name="register" ng-submit="submitForm()" novalidate>
              <div class="input-field col s6">
              <input id="first-name" type="text" class="validate" ng-model="mtitle" required>
              <label for="first-name">Movie Title</label>
            </div>
            <div class="input-field col s6">
              <input id="last-name" type="text" class="validate" ng-model="mdirector" required>
              <label for="last-name">Director</label>
             </div>
             <div class="input-field col s6">            
              <input id="last-name" type="text" class="validate" ng-model="mgenre" required>
              <label for="last-name">Genre</label>
             </div>
             <div class="input-field col s6">            
              <input id="last-name"  type="number" class="validate" ng-model="myear" required>
              <label for="last-name">Release Year</label>
             </div>
             <!-- <div class="input-field col s6">
             <md-datepicker ng-model="mdate" md-placeholder="Enter date"></md-datepicker>
              </div> -->
              <br />
              <div class="spacer text-center">
                 <button ng-disabled="form-register.$invalid" class="btn waves-effect waves-light">
                 <i class="material-icons left">done</i> Done
                 </button>
                 <button type="button" class="waves-effect waves-light btn">
                 <i class="material-icons left">clear</i>Cancel
                 </button>
              </div>
             </form>
      </div>
      <br/>  
  </div>

这是工作小提琴 - jsfiddle.net/5zzpL8om

当我尝试使用其他客户端时，情况正在发生。

Answer 1

我相信你不是故意将数组发送回服务器而是只想发送当前数据。

我试过这个并且它正在运行：

var dataObj = {
            title       : $scope.mtitle,
            director    : $scope.mdirector,
            genre       : $scope.mgenre,
            releaseYear : $scope.myear,
        };

        $http({
          method  : 'POST',
          url     : 'http://movieapp-sitepointdemos.rhcloud.com/api/movies/',
          data    : dataObj, //forms user object
          //headers : {'Content-Type': 'application/x-www-form-urlencoded'} 
         })

这是更新的小提琴： http://jsfiddle.net/5zzpL8om/4/

我还检查了结果： http://movieapp-sitepointdemos.rhcloud.com/api/movies/

$ http.post无法在角度js中工作

1 个答案: