AngularJS Http Postメソッドが動作しません。

AngularJSを使用してデータベースにhttpポストを実行しようとしています。私のコードはエラーを表示しませんが、私のデータベースは更新されていないので、その理由を理解できません。ここに私のコードは次のとおりです。AngularJS Http Postメソッドが動作しません。

//topic-service.js

(function() { 
     'use strict'; 
     angular.module('topic').factory('topicService', topicServiceFunction); 
     topicServiceFunction.$inject = [ '$http', '$q' ]; 
     function topicServiceFunction($http, $q) { 
      var topicService = { 
       getTopics : getTopics 

      } 
      return topicService; 

      function getTopics(obj) { 
       console.log('-->topicServiceFunction'); 
       console.log(obj.name); 
       var deferred = $q.defer(); 
       return $http.post('http://localhost:8080/restapp/api/topic', 
         JSON.stringify(obj)).then(function(response) { 
        if (typeof response.data === 'object') { 
         return response.data; 
        } else { 
         return deferred.reject(response.data); 
        } 
       }, function(response) { 
        return deferred.reject(response.data); 
       }); 

      } 

     } 

    }())

//topic-controller.jsで

(function() { 
     'use strict'; 
     angular.module('topic').controller('topicController', 
       topicControllerFunction); 
     topicControllerFunction.$inject = [ '$scope', 'topicService' ]; 
     function topicControllerFunction($scope, topicService) { 
      $scope.getTopics = getTopics; 
      function getTopics(topicId,name,description,categId,userId) { 
       console.log('-->topictrlFunction'); 
       $scope.topics = []; 

       var obj={ 
     id:$scope.topicId, 
     name:$scope.name, 
     description:$scope.description, 
     id_category:$scope.categId, 
     user_id:$scope.userId 

     } 
     var promise = topicService.getTopics(obj); 
       promise.then(function(data) { 
        if (data != undefined && data != null) { 
         $scope.topics = data; 
        } else { 
         $scope.topics = undefined; 
        } 
       }, function(error) { 
        console.log('error=' + error); 
        $scope.topics = undefined; 
       }) 
       topicService.getTopics(obj); 
       $scope.topics = topicService.getTopics(obj); 
      } 

     } 
    }())

//topic.html

<!DOCTYPE html> 
    <html lang="en" ng-app="myTopics"> 
    <head> 
    <meta charset="UTF-8"> 
    <script src="../../../bower_components/angular/angular.js"></script> 
    <script src="app.js"></script> 
    <script src="topics/module/topic-module.js"></script> 
    <script src="topics/controller/topic-controller.js"></script> 
    <script src="topics/service/topic-service.js"></script> 
    <title>Topics</title> 
    </head> 
    <body> 

     <div ng-controller="topicController"> 
      <div ng-controller="topicController"> 
       <p> 
        Topic id: <input type="text" ng-model="topicId"> 
       </p> 
       <p> 
        Name: <input type="text" ng-model="name"> 
       </p> 
       <p> 
        Description: <input type="text" ng-model="description"> 
       </p> 
       <p> 
        Id category: <input type="text" ng-model="categId"> 
       </p> 
       <p> 
        User id: <input type="text" ng-model="userId"> 
       </p> 
       <button ng-click="getTopics(topicId,name,description,categId,userId)">Add 
        topic</button> 
       <ul ng-repeat="topic in topics"> 
        <li>{{topic.id}} --{{topic.name}} -- {{topic.description}} -- 
         {{topic.id_category}}--{{topic.user_id}}</li> 
       </ul> 

      </div> 
    </body> 
    </html>

出典

2016-08-04 user5642508

トピックコード内であなたが 'POST' –

があなたのAPIへの呼び出しを取得していている間、あなたは、' PUT'要求を作っているの？ APIメソッドが呼び出されたことを確認しましたか？その場合、APIに問題があります – Weedoze

Swagger UIで投稿メソッドを確認しても機能します。また、私はAngularJSで同様の方法でgetメソッドを作っていました。 – user5642508

あなたのサービスは$ qを使用しますが、$ httpの約束を返します。これは生産性が悪く、延期された約束を返すだけです。

ちょうどあなたのリクエストでこのヘッダーを追加し、このため

：headers : {'Content-Type':'application/x-www-form-urlencoded; charset=UTF-8'}

とエンコードデータを$httpParamSerializerJQLikeサービスと

function getTopics(obj) { 

     console.log('-->topicServiceFunction'); 
     console.log(obj.name); 

     var deferred = $q.defer(); 
     var data = JSON.stringify(obj) 

     $http.post('http://localhost:8080/restapp/api/topic', data) 
      .then(function(response) { 
       if (typeof response.data === 'object') { 
        deferred.resolve(response.data); 
       } else { 
        deferred.reject(response.data); 
       } 
      }) 
      .catch(function(response) { 
       return deferred.reject(response.data); 
      }); 

    return deferred.promise; 

}

それはまだあなたがURLエンコードデータではなくJSONを送信しようとする必要があります動作しない場合は3210。このポスト状態の（あなたのサービスでそれを注入）

function getTopics(obj) { 

     console.log('-->topicServiceFunction'); 
     console.log(obj.name); 

     var deferred = $q.defer(); 
     var data = $httpParamSerializerJQLike(obj); 
     var config = { 
     headers : {'Content-Type':'application/x-www-form-urlencoded; charset=UTF-8'} 
     }; 

     $http.post('http://localhost:8080/restapp/api/topic', data, config) 
      .then(function(response) { 
       if (typeof response.data === 'object') { 
        deferred.resolve(response.data); 
       } else { 
        deferred.reject(response.data); 
       } 
      }) 
      .catch(function(response) { 
       return deferred.reject(response.data); 
      }); 

    return deferred.promise; 

}

出典

2016-08-04 06:57:06 Gatsbill

ありがとうございますが、私は試してもまだ動作しません。 – user5642508

今編集しましたが、http httpコールから設定がありません – Gatsbill

ありがとうございました！さて、それは動作します。 – user5642508

AngularJS Http Postメソッドが動作しません。

答えて

関連する問題