2017-11-05 7 views
0

私は、AngularJSとJavaを使用してSPAを作成する方法について詳しく学習しようとしています。私はチュートリアルhereに従って、私はそれを1つのバグを除いて動作させることができました。私が新しいTodoを作成してからtodoリストに戻ると、次のエラーが表示されます。angularjs、java、404、spark

angular.js:8109 POST http://localhost:8080/api/v1/todos 404(見つかりません)

HEJ ERROR 
app.js:51 Error createTodo <html> 
<head> 
<meta http-equiv="Content-Type" content="text/html;charset=ISO-8859-1"/> 
<title>Error 404 </title> 
</head> 
<body> 
<h2>HTTP ERROR: 404</h2> 
<p>Problem accessing /api/v1/todos. Reason: 
<pre> Not Found</pre></p> 
<hr /><i><small>Powered by Jetty://</small></i> 
</body> 
</html> 

私は別のTODOを追加した後、なぜそれが動作しませんが、次のようにコンソール出力がありますか?あなたはドスに戻ったときにPOSTを使用しているように見えます

import static spark.Spark.get; 
import static spark.Spark.post; 
import static spark.Spark.put; 

public class TodoResource { 

    private static final String API_CONTEXT = "/api/v1"; 

    private final TodoService todoService; 

    public TodoResource(TodoService todoService) { 
     this.todoService = todoService; 
     setupEndpoints(); 
    } 

    private void setupEndpoints() { 
     post(API_CONTEXT + "/todos", "application/json", (request, response) -> { 
      todoService.createNewTodo(request.body()); 
      response.status(201); 
      return response; 
     }, new JsonTransformer()); 

     get(API_CONTEXT + "/todos/:id", "application/json", (request, response) 

       -> todoService.find(request.params(":id")), new JsonTransformer()); 

     get(API_CONTEXT + "/todos", "application/json", (request, response) 

       -> todoService.findALL(), new JsonTransformer()); 

     put(API_CONTEXT + "/todos/:id", "application/json", (request, response) 

       -> todoService.update(request.params(":id"), request.body()), new JsonTransformer()); 
    } 


} 

答えて

0

私はそれを解決しました!

最初のエンドポイントから「new JsonTransformer()」を削除しました。

私はなぜそれが働いたのかわかりませんが、それはしました。

0

角度コード

var app = angular.module('todoapp', [ 
    'ngCookies', 
    'ngResource', 
    'ngSanitize', 
    'ngRoute' 
]); 

app.config(function ($routeProvider) { 
    $routeProvider.when('/', { 
     templateUrl: 'views/list.html', 
     controller: 'ListCtrl' 
    }).when('/create', { 
     templateUrl: 'views/create.html', 
     controller: 'CreateCtrl' 
    }).otherwise({ 
     redirectTo: '/' 
    }) 
}); 

app.controller('ListCtrl', function ($scope, $http) { 
    $http.get('/api/v1/todos').success(function (data) { 
     $scope.todos = data; 
    }).error(function (data, status) { 
     console.log('Error listctrl ' + data) 
    }) 

    $scope.todoStatusChanged = function (todo) { 
     console.log(todo); 
     $http.put('/api/v1/todos/' + todo.id, todo).success(function (data) { 
      console.log('status changed'); 
     }).error(function (data, status) { 
      console.log('Error todostatuschanged' + data) 
     }) 
    } 
}); 

app.controller('CreateCtrl', function ($scope, $http, $location) { 
    $scope.todo = { 
     done: false 
    }; 

    $scope.createTodo = function() { 
     console.log($scope.todo); 
     $http.post('/api/v1/todos', $scope.todo, $location).success(function (data) { 
      console.log("HEJ") 
      $location.path('/'); 
     }).error(function (data, status) { 
      console.log("HEJ ERROR") 
      console.log('Error createTodo ' + data) 
     }) 
    } 
}); 

Javaコード。

angular.js:8109 POST http://localhost:8080/api/v1/todos 404(見つかりません)

あなたがGETリクエストを発行する必要があります。

+0

ありがとうございました。 $ scope.createtodo関数のコードを見てください。 $ location.path( "/")を使用してlistcontrollerにリルートしませんか? "location.path(/)"は最初のコントローラでGET reuqestを自動的に使用すると考えました – Markus

+0

POSTをGETに変更するだけで、新しいToDoがデータベースに挿入されないためです。 – Markus