Как отправить форму из Angular в PHP?
Я пытаюсь отправить свою форму из angular 5 в свой файл php и повторно ввести
результат обратно в angular
/* My typescrit file */
import { Component, OnInit, AfterViewInit, ViewChild } from '@angular/core';
import { trigger , state, style, transition, animate, keyframes } from
'@angular/animations';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { Headers, Response, RequestOptions } from '@angular/http';
import { Observable } from 'rxjs/Observable';
import { MatButtonModule, MatCardModule, MatMenuModule, MatToolbarModule,
MatIconModule, MatCheckboxModule, MatRadioModule, MatSelectModule,
MatInputModule, MatDialogModule, MatTooltipModule, MatSnackBarModule,
MatSidenavModule } from '@angular/material';
import { ReactiveFormsModule, FormBuilder, FormGroup, FormControl, Validators } from '@angular/forms';
constructor(public http: HttpClient) {}
let formdata = document.querySelector('form');
let datajson= {
action: 'login',
username: formdata.username.value,
useremail: formdata.useremail.value,
usersubject: formdata.usersubject.value,
usermessage: formdata.usermessage.value
};
let apiurl = '../../assets/php/message.php';
this.http.post(apiurl,datajson)
.subscribe(data => {alert(data.data)})
.catch(error=>{ alert (error.status)});
</pre>
Но я получаю "Http undefined error".
Какой у Вас вопрос? Что происходит и чего бы вы хотели? - Джето 2 часа назад Джето, я просто хочу отправить информацию формы из angular 4 или 5 в файл php (для удобства там ...). Я знаю метод с угловыми 1 или 2, но я использую angular 5. Спасибо за вашу помощь.
Ответы 2
Вы можете добиться этого, отправив запрос get или post с контроллера angular на страницу php. Пример кода должен понравиться (он с моего сайта):
app.controller('sign_up', function ($scope, $http) {
/*
* This method will be called on click event of button.
* Here we will read the email and password value and call our PHP file.
*/
$scope.check_credentials = function () {
document.getElementById("message").textContent = "";
var request = $http({
method: "post",
url: window.location.href + "login.php",
data: {
email: $scope.email,
pass: $scope.password
},
headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
});
/* Check whether the HTTP Request is successful or not. */
request.success(function (data) {
document.getElementById("message").textContent = "You have login successfully with email "+data;
});
}
Вопрос относится к Angular2 +.
http не определен, потому что вы пытаетесь использовать его, не определяя его в своем классе.
Я предполагаю, что этот файл, который вы показываете, взят из вашего app.module.ts? Если да, импортируйте туда HttpClientModule.
import { HttpClientModule } from '@angular/common/http';
...
imports: [
// import HttpClientModule after BrowserModule.
HttpClientModule,
],
Зайдите в свой app.component.ts и сделайте там свой запрос. Или в любом компоненте, который вы хотите, чтобы это было сделано.
import { Component, OnInit, Input } from '@angular/core';
import { HttpClient } from '@angular/common/http';
@Component({
selector: 'app',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit {
datajson= {
action: 'login',
username: formdata.username.value,
useremail: formdata.useremail.value,
usersubject: formdata.usersubject.value,
usermessage: formdata.usermessage.value
};
apiurl = '../../assets/php/message.php';
constructor(private http: HttpClient) {
this.http.post(apiurl, datajson).subscribe(data => {alert(data.data)}
.catch(error=> {alert(error)}
}
}
Я импортировал HttpClientModule в app.module.ts, но я все еще получаю эту ошибку: core.js: 1427 ОШИБКА TypeError: невозможно прочитать свойство 'post' неопределенного в HTMLButtonElement.eval (home.component.ts: 168) в ZoneDelegate.invokeTask (зона .js: 425) в Object.onInvokeTask (core.js: 4744) в ZoneDelegate.invokeTask (zone.js: 424) в Zone.runTask (zone.js: 192) в ZoneTask.invokeTask [as invoke] (zone.js : 499) в invokeTask (zone.js: 1540) в HTMLButtonElement.globalZoneAwareCallback (zone.js: 1566)
да, он скажет undefined, потому что вы не определили http constructor(private http: HttpClient) { this.http.post(apiurl, datajson).subscribe(data => {alert(data.data)} .catch(error=> {alert(error)} }
Какой у Вас вопрос? Что происходит и чего бы вы хотели?