typescript - Angular를 사용하여 서버에 게시 요청하기

각도에서 post 메소드를 사용하는 작업 지식을 확인하기 위해 일부 데이터를 만들고 URL에 던지려고합니다. 내가 사용하는 URL은 'http://jsonplaceholder.typicode.com/'에서 가져온 'http://jsonplaceholder.typicode.com/posts'입니다. 메인 페이지에는 모든 Http 메서드가 지원된다고 나와 있습니다. 나는 온라인 튜토리얼에 따라 만든 양식을 단순히 데이터를 제출하려고합니다. URL을 새로 고치려고 할 때 이미있는 나머지 데이터와 함께 내 데이터가 표시되지 않습니다. 내가 생성하거나 보낼 수없는 이유를 아는 사람이 있습니까? 구성 요소와 템플릿을 첨부했습니다.

<h1>Post API in Angular</h1>
<form #signupForm="ngForm" (ngSubmit)="submit(signupForm.value)">
    <input type="text" name="userId" ngModel placeholder="User ID"><br><br>
    <input type="text" name="id" ngModel placeholder="ID"><br><br>
    <input type="text" name="title" ngModel placeholder="Title"><br><br>
    <input type="text" name="body" ngModel placeholder="Body"><br><br>
    <button type="submit">Submit Data</button>
</form>

import { Component, OnInit } from '@angular/core';
import {HttpClient} from '@angular/common/http';
@Component({
  selector: 'post',
  templateUrl: './post.component.html',
  styleUrls: ['./post.component.css']
})
export class PostComponent {
  private url = 'http://jsonplaceholder.typicode.com/posts';
  myData: any[];
  constructor(private http: HttpClient){
    http.get(this.url)
      .subscribe(response=>{
        this.myData = response as any[];
      })
  } 
  constructor(private http: HttpClient){}
  submit(data){
    this.http.post(this.url, data)
      .subscribe(result=>{
        console.log("Result", result);
      });
  }
}