0
私は、ビューの1つに投稿を追加するフォームが含まれているアプリケーションを作成しています。私は偽物JSONplaceholder APIを使用しています。リソースは実際にサーバー上に作成されませんが、それはまるで仮説です。私は私が作成していますポストのタイトルと本文を返すためにconsole.logを使用していますが、唯一のIDは、コンソールに表示されるので、のように：Object {id: 101}
ここに私のコードです：
<body layout="column" ng-app="myApp" ng-cloak ng-controller="controller">
<h1>{{apptitle}}</h1>
<script type="text/ng-template" id="allposts.htm">
<a href="#addpost">
<button type="button" class="btn btn-primary" ng-model="singleModel" uib-btn-checkbox btn-checkbox-true="1" btn-checkbox-false="0">
Add a post
</button>
</a>
View
<select ng-model="viewby" ng-change="setItemsPerPage(viewby)">
<option>9</option>
<option>18</option>
<option>36</option>
<option>100</option>
</select>posts
<div class="row" ng-repeat="collatedPostList in collatedPosts">
<div class="onepost col-xs-4 box" ng-repeat="post in collatedPostList">
<div class="inner">
<a href="#post">{{post.title}}</a>
<hr>
<p>{{post.body | limitTo: 60}}{{post.body.length < 20 ? '' : '...'}}</p>
</div>
</div>
</div>
<div class="text-center">
<ul uib-pagination total-items="totalItems" ng-model="currentPage" class="pagination-sm"
items-per-page="itemsPerPage" ng-change="pageChanged(currentPage)"></ul>
</div>
</script>
<script type="text/ng-template" id="post.htm">
</script>
<script type="text/ng-template" id="addpost.htm">
<form ng-submit="submit()" class="adding">
<input id="titleadd" type="text" name="title" ng-model="title" placeholder="Add title">
<br>
<input id="textadd" type="text" name="body" ng-model="body" placeholder="Add some text">
<br>
<button type="submit" class="btn btn-primary" id="submit" value="Submit">
Post it
</button>
<a href="#allposts">
<button type="button" class="btn btn-primary" >
Go back to post list
</button></a>
</form>
</script>
<div ng-view></div>
<script src="app.js"></script>
</body>
JSは：
Array.prototype.collate = function(collateSize) {
var collatedList = [];
if (collateSize <= 0) {
return [];
}
angular.forEach(this, function(item, index) {
if (index % collateSize === 0) {
collatedList[Math.floor(index/collateSize)] = [item];
} else {
collatedList[Math.floor(index/collateSize)].push(item);
}
});
return collatedList;
};
var myApp = angular.module('myApp', ['ngRoute', 'ui.bootstrap']);
myApp.config(function($routeProvider) {
$routeProvider.when('/', {
templateUrl: 'allposts.htm',
controller: 'PostsController'
}).when('/post', {
templateUrl: 'post.htm',
controller: 'PostController'
}).when('/addpost', {
templateUrl: 'addpost.htm',
controller: 'AddController'
}).otherwise({
redirectTo: '/'
});
});
myApp.controller('PostsController', function($scope) {});
myApp.controller('PostController', function($scope) {});
myApp.controller('AddController', function($scope) {});
myApp.controller('controller', function($scope, $http) {
$scope.apptitle = "Kansi app";
$http({
method: 'GET',
url: "http://jsonplaceholder.typicode.com/posts"
}).then(function(response) {
$scope.posts = response.data;
$scope.viewby = 9;
$scope.totalItems = $scope.posts.length;
$scope.currentPage = 1;
$scope.itemsPerPage = $scope.viewby;
$scope.maxSize = 5;
$scope.collatedPosts = getCollatedPosts($scope.posts);
});
$scope.submit = function(){
$http({
method:'POST',
url:"http://jsonplaceholder.typicode.com/posts",
data : {
title: $scope.title,
body: $scope.body
},
headers: {
'Content-Type': 'application/json'
}
})
.success(function(response){
$scope.result = response;
console.log($scope.result);
})
.error(function(){
console.log("error");
});
};
function getCollatedPosts(posts) {
if (!posts) {
return [];
}
var paginatedPosts = posts.slice((($scope.currentPage - 1) * $scope.itemsPerPage), (($scope.currentPage) * $scope.itemsPerPage));
return paginatedPosts.collate(3);
}
$scope.setPage = function(pageNo) {
$scope.currentPage = pageNo;
};
$scope.setItemsPerPage = function(num) {
$scope.itemsPerPage = num;
$scope.currentPage = 1; //reset to first page
$scope.collatedPosts = getCollatedPosts($scope.posts);
};
$scope.pageChanged = function(currentPage) {
$scope.currentPage = currentPage;
$scope.collatedPosts = getCollatedPosts($scope.posts);
};
});
ネットワーク： 
コンソールにはエラーはありません。なぜ唯一のIDは戻っている？
[ネットワーク]タブでサーバーから送信されるものを確認しようとしましたか？いずれにせよ、送信されているものと受信されているものを確認するだけで簡単です。 Angularは本当に心配していません。あなたは行動を調べるために[MCVE]（http://stackoverflow.com/help/mcve）を提供していないので、あなたは誰でもこれを行うことができます。 – estus
私の質問が更新されました – summerfreeze