как получить данные из базы данных в угловых 7? - PullRequest
Новая
       16

как получить данные из базы данных в угловых 7?

0 голосов
/ 04 июня 2019

У меня при получении данных из базы данных с помощью PHP fetch API.ниже PHP fetch API работает нормально с реагирующим приложением, но выдает ошибку, используя выборку с помощью angular.вот мой полный код с PHP fetch API.

app.component.ts: 

import { Component } from '@angular/core';
import {HttpClient} from '@angular/common/http';
import { Observable } from 'rxjs';
import { Injectable } from '@angular/core';

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent  {
   constructor(private httpClient: HttpClient){}
  name = 'My App';
 students:any = [];
  baseUrl='http://veomit.com/test/zend/api/fetch.php';
  get_products(){
        this.httpClient.get(this.baseUrl).subscribe((res :{})=>{
        console.log(res);
        this.students = res;
        });
    }
}

app.component.html: 

<hello name="{{ name }}"></hello>
<p>
  Start editing to see some magic happen :)
</p>
<button (click)="get_products()">GET Data</button>
<ul>
      <li *ngFor="let student of students" >
        userId: {{student.name}}
        Hellotitle: {{student.department}}
        body: {{student.marks}}
      </li>
    </ul>

php fetch API - fetch.php 

<?php 

    header("Access-Control-Allow-Origin: *");
    header("Access-Control-Request-Headers: GET,POST,OPTIONS,DELETE,PUT");
$con = mysqli_connect("mysql1004.mochahost.com","a310387_task_for","task_force","a310387_task_force");
$ar=array();

     $query=mysqli_query($con,"select * from student");
     while ($rows=mysqli_fetch_array($query)) {
        $ar[]=$rows;
     }
 echo json_encode($ar);

 ?>
```
Below is my console error:

    HttpErrorResponse {headers: {…}, status: 0, statusText: "Unknown Error", url: "http://veomit.com/test/zend/api/fetch.php"…}
    error: ProgressEvent
    isTrusted: true
    __proto__: ProgressEvent
    headers: HttpHeaders
    headers: Array[0]
    lazyUpdate: null
    normalizedNames: Array[0]
    __proto__: HttpHeaders
    message: "Http failure response for http://veomit.com/test/zend/api/fetch.php: 0 Unknown Error"
    name: "HttpErrorResponse"
    ok: false
    status: 0
    statusText: "Unknown Error"
    url: "http://veomit.com/test/zend/api/fetch.php"
    __proto__: HttpErrorResponse

1 Ответ

0 голосов
/ 29 июня 2019

Пожалуйста, сначала сгенерируйте сервисы из этой команды ng g service_name затем построить функцию - 

 getAllData(url, headerData = {}){
    const getUrl = this.apiUrl + url;
    //let header:any={'authtoken':this.token};
    return this.http.get(getUrl, { headers: headerData })
    .map(result => result)
    .catch(this.handleError)
  }

затем в приложении componenten.ts 

get_product(){

 this.service_name.getAllData(this.url).subscribe(
   (response: any) => {

      if (response.status == true) {
      
      } else {
       
      }
    });
}
...