私はまだこれで新しいですが、学習のために私自身のデータをhttps://jsonplaceholder.typicode.com/usersに投稿しようとしています。ページの下部にはnpm install -g json-server
を使用しているので、プロジェクトでそのコマンドを実行し、上記のWeb URLにデータを投稿しようとしました。静的なjsonファイルに投稿してみました。 npm install -g json-serverコマンドを実行しますが、ローカルファイルを使用しているときにjsonファイルが見つからない場合は、上記のURLに投稿しようとすると、コンソールログのポストを表示しますが、ユーザーは決して更新しません。誰も私に私のPOSTデータを見ることができるようにこれを動作させる方法を教えてもらえますか?投稿するjsonサーバーの問題
user.service.ts
import {Injectable} from '@angular/core';
import 'rxjs/add/operator/map';
import {Http, Headers} from '@angular/http';
import {User} from './user';
@Injectable()
export class UserService{
constructor(private _http:Http){
}
getUsers(){
return this._http.get('http://localhost:4200/users')
.map(res=>res.json());
}
addUser(post){
return this._http.post('http://localhost:4200/users', post)
.map(res=> res.json());
}
}
form.component.ts
import { Component, OnInit } from '@angular/core';
import {UserService} from '../users.service';
import {Http} from '@angular/http';
import {Router} from '@angular/router';
import {FormGroup, FormControl} from '@angular/forms';
@Component({
selector: 'app-form',
templateUrl: './form.component.html',
styleUrls: ['./form.component.css'],
providers: [UserService]
})
export class FormComponent implements OnInit{
private user;
private _users;
constructor(
private _userService:UserService
){
}
userForm = new FormGroup({
name: new FormControl(),
username: new FormControl(),
email: new FormControl(),
address: new FormGroup({
street: new FormControl(),
suite: new FormControl(),
city: new FormControl(),
postalcode: new FormControl()
})
});
onSubmit(){
this._userService.addUser(this.userForm.value)
.subscribe(res => {
this.user = res;
console.log(res);
})
}
}
サーバーを起動しましたか?また、あなたのURLは、依然として自分のローカルではなくオンライン版を指しているようです。 –
私はそれを両方に指摘しようとしました。私は上記のコードをオンラインに向けて投稿しましたが、app/users.json(ローカルファイルですが、見つからないというメッセージが表示されます)を指摘しました。 GETリクエストと同じパスなので、パスが正しいことがわかります。上記のコードをローカルのjsonファイルを反映するように更新しました – user6680