Angular 2からPHPにajaxリクエスト[POST]を送信するには？

Question

私はこの種の問題を達成するために最善を尽くして、ドキュメントを検索し、重複している可能性のある質問を探していたので、不満を感じています。

私はこのドキュメントhttps://angular.io/docs/ts/latest/guide/server-communication.htmlを読んだことがありますが、これにはPHPでデータを投稿する例はありません。

私がしたいことは、承認されていないトランザクションがある場合にデータベースをチェックすることです。 3秒ごとに実行されます。輸入とGetNewDataService - - プロバイダ

は、ここで私は私のapp.module.tsオン[get-new-data.service.ts]

import { Injectable } from '@angular/core'; 
import { Http, Response, Headers, RequestOptions } from '@angular/http'; 
import 'rxjs/Rx'; 

@Injectable() 
export class GetNewDataService { 
    constructor(private http: Http) { } 
    private url = 'app/service/getDataService.php'; 

    getData(bangko) { 
     let headers = new Headers('Content-Type', 'application/x-www-form-urlencoded'), 
      options = new RequestOptions({ headers: headers }), 
      bank = `bank=${bangko}`; 

     return this.http.post(this.url, bank, options).map(res => res.json()); 
    } 
} 

私のサービスを作成し、私は

を持っているものだ、私はHttpModuleを輸入しました。私は、適切な要求を行うとMySQLとPHPと私の角度2のアプリを統合する方法を知らない私のコンポーネント

import { Component, OnInit } from '@angular/core'; 
import { GetNewDataService } from '../service/get-new-data.service'; 
import { Observable } from 'rxjs/Rx'; 

@Component({ 
    templateUrl: 'app/tpl-html/mandiri.component.html' 
}) 

export class MandiriComponent implements OnInit { 
    constructor(private getDataService: GetNewDataService) { } 

    ngOnInit() { 
     setInterval(() => { 
      this.getDataService.getData('mandiri') 
       .subscribe(res => console.log(res)); 
     }, 3000) 
    } 
} 

で

。

ご協力いただければ幸いです。ありがとう：/

Answer 1

ここに行く..

Htmlの

<div ng-app="myApp"> 
<form ng-controller="FormCtrl" ng-submit="submitForm()"> 
    First name: <br/><input type="text" ng-model="form.firstname"> <br/><br/> 
    Email Address: <br/><input type="text" ng-model="form.emailaddress"> <br/><br/> 
    Description:<br/> <textarea rows="3" cols="25" ng-model="form.textareacontent"></textarea> 
     <br/> 
    <input type="radio" ng-model="form.gender" value="female" />Female ... 
    <input type="radio" ng-model="form.gender" value="male" />Male <br/> 
     <br/> 
    <input type="checkbox" ng-model="form.member" />Already a member 
     <br/> 
    <input type="submit" ngClick="Submit" > 
</form> 
<div id="getdata"></div> 
</div> 

スクリプト

var app = angular.module('myApp', ['ngSanitize']); 
    app.controller('FormCtrl', function ($scope, $sce, $http) { 
    var formData = { 
     firstname: "default", 
     emailaddress: "default", 
     textareacontent: "default", 
     gender: "default", 
     member: false 
    }; 
    $scope.submitForm = function() { 
    $http({ 
     url: "form.php", 
     data: $scope.form, 
     method: 'POST', 
     headers : {'Content-Type':'application/x-www-form-urlencoded; charset=UTF-8'} 

     }).success(function(data){ 
      console.log("OK", data); 
     }).error(function(err){"ERR", console.log(err)}) 
    }; 
    }); 

PHPの

$file = 'form2.txt'; 
$postdata = file_get_contents("php://input"); 
$data = json_decode($postdata, true); 
echo '<h3>Name ='.$data['firstname']."<br/>".'Email ='.$data['emailaddress']."<br/>".'Description ='.$data['textareacontent']."</h3>"; 

Answer 2

Post JSON from angular 2 to php

http://4dev.tech/2016/07/using-http-client-to-integrate-angular2-to-php/

var link = 'app/service/getDataService.php'; 
var data = JSON.stringify({username: this.data.username}); 

this.http.post(link, data) 
.subscribe(data => { 
this.data.response = data._body; 
}, error => { 
    console.log("Oooops!"); 
}); 

あなたが得ているエラー