How to get and show phpmysql data in angularjs2 or 4?

Hello, welcome to therichpost.com. In this post, I will tell you How to get and show php mysql data in angularjs 2 or 4? Nowadays Angularjs is very popular and known as one page website. I am familiar with Angular 1 very well but Angular 2 is totally different with Angular 1. Angular2 is totally command based. Today we will get mysql in angularjs component and show in angularjs html template.

i am also learning angularjs 2 and 4 and I will also tell you to implement, bootstrap in Angularjs 2 or 4.

i will tell you to get code for mysql data and also tell you how to show this code in angular 2 template.

First please check code in angularjs 2 component and you need to add the code in component(app-simple-form.component.ts):

import { Component, OnInit } from ‘@angular/core’;
import { Http, Response ,RequestOptions,Headers} from ‘@angular/http’;
@Component({
selector: ‘app-simple-form’,
templateUrl: ‘./simple-form.component.html’,
styleUrls: [‘./simple-form.component.css’]
})
export class SimpleFormComponent implements OnInit {
posts: any;
constructor(public http: Http) {
// mypage.php that page from where we will get data and I put that file on my root
this.http.get(‘http://localhost/mypage.php’).map(res => res.json()).subscribe(data => {
this.posts = data;
// show data in console
console.log(this.posts);
});
}
ngOnInit() {
}
}

Here is the code to get php data in html format with angular2 directives and you need to add this angularjs 2 html template(simple-form.component.html):

<ul *ngFor=”let data of posts”>
<li>{{ name.id }}</li>
<li>{{ name.firstName }}</li>
<li>{{ name.lastName }}</li>
</ul>

Here is the code for php and you need to add this in mypage.php file:

header(“Access-Control-Allow-Origin: *”);
header(“Access-Control-Allow-Methods: PUT, GET, POST”);
header(“Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept”);
$conn = new mysqli(‘localhost’,’root’,’root’,’users’);
$sql = “SELECT * FROM users_tbl”;
$result = $conn->query($sql);
$myArr = array();
if ($result->num_rows > 0) {
// output data of each row
while($row = $result->fetch_assoc()) {
$myArr[] = $row;
}
} else {
echo “0 results”;
}

$myJSON = json_encode($myArr);
echo $myJSON;