2016-12-17 3 views
13

내 angular 2 프로젝트에 양식이 있습니다.각도 2로 양식 데이터를 가져 오는 방법

API에서 데이터를 검색하는 방법을 알고 있습니다. 그러나 거기에서 CRUD 작업을 수행하는 방법을 모른다.

은 아무도

도움말이 이해 될 것이다 ... PHP/다른 언어에서 웹 서비스를 JSON 형식으로 양식 데이터를 전송하는 방법에 대한 간단한 코드를 도와 줄 수 있습니다. 각도 2+ 감사

+0

이 링크 확인 ... http://stackoverflow.com/questions/41154319/how-to-post-json-object-with-http-post-angular-2-php-server-side –

+0

@AmitSuhag, 두 가지 모두 클릭 이벤트 및 onSubmit 메서드에 의해 폼 데이터를 바인딩하는 방법을 알고 싶습니다. 그리고 그것을 어떻게 문자열화할 것인가. 전체 패키지 솔루션으로 나를 도울 수 있습니까? 그것은 나를 위해 매우 도움이 될 것입니다 ... –

답변

22

우리는 형태의 두 가지 방법으로 처리 :

  • 템플릿 기반
  • 반응성

여기에 내가 간단한 템플릿 기반 형태의 코드를 공유하고 있습니다. 당신이 다음이 링크를 확인 반응 양식을 사용하여 수행하려는 경우 : Angular2 reactive form confirm equality of values

모듈 파일이 있어야한다 :

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic' 
import { ReactiveFormsModule, FormsModule } from '@angular/forms'; 
import { MyApp } from './components' 

@NgModule({ 
    imports: [ 
    BrowserModule, 
    FormsModule, 
    ReactiveFormsModule 
    ], 
    declarations: [MyApp], 
    bootstrap: [MyApp] 
}) 
export class MyAppModule { 

} 

platformBrowserDynamic().bootstrapModule(MyAppModule) 

간단한 등록 html 파일 :

<form #signupForm="ngForm" (ngSubmit)="registerUser(signupForm)"> 
    <label for="email">Email</label> 
    <input type="text" name="email" id="email" ngModel> 

    <label for="password">Password</label> 
    <input type="password" name="password" id="password" ngModel> 

    <button type="submit">Sign Up</button> 
</form> 

을 이제 registration.ts을 파일은 다음과 같아야합니다.

import { Component } from '@angular/core'; 
import { NgForm } from '@angular/forms'; 

@Component({ 
    selector: 'register-form', 
    templateUrl: 'app/register-form.component.html', 
}) 
export class RegisterForm { 
    registerUser(form: NgForm) { 
    console.log(form.value); 
    // {email: '...', password: '...'} 
    // ... <-- now use JSON.stringify() to convert form values to json. 
    } 
} 

이 데이터를 처리하려면 서버 쪽에서이 링크를 사용하십시오 : How to post json object with Http.post (Angular 2) (php server side). 나는 이것이 충분하다고 생각한다.

+0

굉장! 이것에 대한 도움을 많이 주셔서 감사합니다. –

관련 문제