Angular 7 connecting MySql
0
I'm trying to connect my angular project to mysql database. I tried some example
but i had some NullInjectorError error:
[PostUsersComponent -> MysqlService]:
StaticInjectorError(Platform: core)[PostUsersComponent -> MysqlService]:
NullInjectorError: No provider for MysqlService!
Please help for this problem :)))
Angular version 7
The service is here
import { Injectable } from '@angular/core';
import { Http, Headers, Response } from '@angular/http';
import 'rxjs/operators';
import { map } from 'rxjs/operators';
@Injectable()
export class MysqlService {
constructor(public _http: Http) {
}
public addMysqlUserDatas(_firstname: string, _lastname: string) {
const url = 'http://localhost:4200/post_users.php';
const headers = new Headers();
headers.append('Content-Type', 'application/x-www-form-urlencoded');
return this._http.post(url, {id: '', firstname: _firstname, lastname: _lastname}, {headers: headers})
.pipe(map((res: Response) => res.text()))
.subscribe(res => {
console.log(res.toString());
});
}
public getMysqlUsersDatas() {
return this._http.get('http://localhost:4200//get_users.php')
.pipe(map(rep => rep.json()));
}
public getLocalUsersDatas() {
return this._http.get('./assets/users.json')
.pipe(map(rep => rep.json()));
}
public getLocalTextDatas() {
return this._http.get('./assets/read.txt')
.pipe(map(rep => rep.text()));
}
}javascript mysql
angular angular7 edited Nov 27 '18 at 7:57
Goncalo Peres
1,4691619
asked Nov 24 '18 at 10:19
TserenjamtsTserenjamts
84
add a comment |
0
I'm trying to connect my angular project to mysql database. I tried some example
but i had some NullInjectorError error:
[PostUsersComponent -> MysqlService]:
StaticInjectorError(Platform: core)[PostUsersComponent -> MysqlService]:
NullInjectorError: No provider for MysqlService!
Please help for this problem :)))
Angular version 7
The service is here
import { Injectable } from '@angular/core';
import { Http, Headers, Response } from '@angular/http';
import 'rxjs/operators';
import { map } from 'rxjs/operators';
@Injectable()
export class MysqlService {
constructor(public _http: Http) {
}
public addMysqlUserDatas(_firstname: string, _lastname: string) {
const url = 'http://localhost:4200/post_users.php';
const headers = new Headers();
headers.append('Content-Type', 'application/x-www-form-urlencoded');
return this._http.post(url, {id: '', firstname: _firstname, lastname: _lastname}, {headers: headers})
.pipe(map((res: Response) => res.text()))
.subscribe(res => {
console.log(res.toString());
});
}
public getMysqlUsersDatas() {
return this._http.get('http://localhost:4200//get_users.php')
.pipe(map(rep => rep.json()));
}
public getLocalUsersDatas() {
return this._http.get('./assets/users.json')
.pipe(map(rep => rep.json()));
}
public getLocalTextDatas() {
return this._http.get('./assets/read.txt')
.pipe(map(rep => rep.text()));
}
}javascript mysql
angular angular7 edited Nov 27 '18 at 7:57
Goncalo Peres
1,4691619
asked Nov 24 '18 at 10:19
TserenjamtsTserenjamts
84
@Bm8's answer is correct, but you have a few additional issues. First, headers.append() returns a new Headers object, it doesn't modify the old one. So your headers will not be sent. Second, the default port for the Angular dev server is 4200, so it's unlikely that your back end server is on that port. Third, you don't need to map the result of the http call to JSON, it's already JSON.
– GreyBeardedGeek
Nov 24 '18 at 11:43
Oh, and you also can't do an http get of something that's in your app's assets folder, because it's compiled into the Angular app, which is running in the browser.
– GreyBeardedGeek
Nov 24 '18 at 11:51
add a comment |
0
0
0
I'm trying to connect my angular project to mysql database. I tried some example
but i had some NullInjectorError error:
[PostUsersComponent -> MysqlService]:
StaticInjectorError(Platform: core)[PostUsersComponent -> MysqlService]:
NullInjectorError: No provider for MysqlService!
Please help for this problem :)))
Angular version 7
The service is here
import { Injectable } from '@angular/core';
import { Http, Headers, Response } from '@angular/http';
import 'rxjs/operators';
import { map } from 'rxjs/operators';
@Injectable()
export class MysqlService {
constructor(public _http: Http) {
}
public addMysqlUserDatas(_firstname: string, _lastname: string) {
const url = 'http://localhost:4200/post_users.php';
const headers = new Headers();
headers.append('Content-Type', 'application/x-www-form-urlencoded');
return this._http.post(url, {id: '', firstname: _firstname, lastname: _lastname}, {headers: headers})
.pipe(map((res: Response) => res.text()))
.subscribe(res => {
console.log(res.toString());
});
}
public getMysqlUsersDatas() {
return this._http.get('http://localhost:4200//get_users.php')
.pipe(map(rep => rep.json()));
}
public getLocalUsersDatas() {
return this._http.get('./assets/users.json')
.pipe(map(rep => rep.json()));
}
public getLocalTextDatas() {
return this._http.get('./assets/read.txt')
.pipe(map(rep => rep.text()));
}
}javascript mysql
angular angular7 edited Nov 27 '18 at 7:57
Goncalo Peres
1,4691619
asked Nov 24 '18 at 10:19
TserenjamtsTserenjamts
84
I'm trying to connect my angular project to mysql database. I tried some example
but i had some NullInjectorError error:
[PostUsersComponent -> MysqlService]:
StaticInjectorError(Platform: core)[PostUsersComponent -> MysqlService]:
NullInjectorError: No provider for MysqlService!
Please help for this problem :)))
Angular version 7
The service is here
import { Injectable } from '@angular/core';
import { Http, Headers, Response } from '@angular/http';
import 'rxjs/operators';
import { map } from 'rxjs/operators';
@Injectable()
export class MysqlService {
constructor(public _http: Http) {
}
public addMysqlUserDatas(_firstname: string, _lastname: string) {
const url = 'http://localhost:4200/post_users.php';
const headers = new Headers();
headers.append('Content-Type', 'application/x-www-form-urlencoded');
return this._http.post(url, {id: '', firstname: _firstname, lastname: _lastname}, {headers: headers})
.pipe(map((res: Response) => res.text()))
.subscribe(res => {
console.log(res.toString());
});
}
public getMysqlUsersDatas() {
return this._http.get('http://localhost:4200//get_users.php')
.pipe(map(rep => rep.json()));
}
public getLocalUsersDatas() {
return this._http.get('./assets/users.json')
.pipe(map(rep => rep.json()));
}
public getLocalTextDatas() {
return this._http.get('./assets/read.txt')
.pipe(map(rep => rep.text()));
}
}import { Injectable } from '@angular/core';
import { Http, Headers, Response } from '@angular/http';
import 'rxjs/operators';
import { map } from 'rxjs/operators';
@Injectable()
export class MysqlService {
constructor(public _http: Http) {
}
public addMysqlUserDatas(_firstname: string, _lastname: string) {
const url = 'http://localhost:4200/post_users.php';
const headers = new Headers();
headers.append('Content-Type', 'application/x-www-form-urlencoded');
return this._http.post(url, {id: '', firstname: _firstname, lastname: _lastname}, {headers: headers})
.pipe(map((res: Response) => res.text()))
.subscribe(res => {
console.log(res.toString());
});
}
public getMysqlUsersDatas() {
return this._http.get('http://localhost:4200//get_users.php')
.pipe(map(rep => rep.json()));
}
public getLocalUsersDatas() {
return this._http.get('./assets/users.json')
.pipe(map(rep => rep.json()));
}
public getLocalTextDatas() {
return this._http.get('./assets/read.txt')
.pipe(map(rep => rep.text()));
}
}import { Injectable } from '@angular/core';
import { Http, Headers, Response } from '@angular/http';
import 'rxjs/operators';
import { map } from 'rxjs/operators';
@Injectable()
export class MysqlService {
constructor(public _http: Http) {
}
public addMysqlUserDatas(_firstname: string, _lastname: string) {
const url = 'http://localhost:4200/post_users.php';
const headers = new Headers();
headers.append('Content-Type', 'application/x-www-form-urlencoded');
return this._http.post(url, {id: '', firstname: _firstname, lastname: _lastname}, {headers: headers})
.pipe(map((res: Response) => res.text()))
.subscribe(res => {
console.log(res.toString());
});
}
public getMysqlUsersDatas() {
return this._http.get('http://localhost:4200//get_users.php')
.pipe(map(rep => rep.json()));
}
public getLocalUsersDatas() {
return this._http.get('./assets/users.json')
.pipe(map(rep => rep.json()));
}
public getLocalTextDatas() {
return this._http.get('./assets/read.txt')
.pipe(map(rep => rep.text()));
}
}javascript mysql
angular angular7 javascript mysql
angular angular7 edited Nov 27 '18 at 7:57
Goncalo Peres
1,4691619
asked Nov 24 '18 at 10:19
TserenjamtsTserenjamts
84
edited Nov 27 '18 at 7:57
Goncalo Peres
1,4691619
asked Nov 24 '18 at 10:19
TserenjamtsTserenjamts
84
edited Nov 27 '18 at 7:57
Goncalo Peres
1,4691619
edited Nov 27 '18 at 7:57
Goncalo Peres
1,4691619
edited Nov 27 '18 at 7:57
Goncalo Peres
1,4691619
1,4691619
asked Nov 24 '18 at 10:19
TserenjamtsTserenjamts
84
asked Nov 24 '18 at 10:19
TserenjamtsTserenjamts
84
asked Nov 24 '18 at 10:19
TserenjamtsTserenjamts
84
84
@Bm8's answer is correct, but you have a few additional issues. First, headers.append() returns a new Headers object, it doesn't modify the old one. So your headers will not be sent. Second, the default port for the Angular dev server is 4200, so it's unlikely that your back end server is on that port. Third, you don't need to map the result of the http call to JSON, it's already JSON.
– GreyBeardedGeek
Nov 24 '18 at 11:43
Oh, and you also can't do an http get of something that's in your app's assets folder, because it's compiled into the Angular app, which is running in the browser.
– GreyBeardedGeek
Nov 24 '18 at 11:51
add a comment |
@Bm8's answer is correct, but you have a few additional issues. First, headers.append() returns a new Headers object, it doesn't modify the old one. So your headers will not be sent. Second, the default port for the Angular dev server is 4200, so it's unlikely that your back end server is on that port. Third, you don't need to map the result of the http call to JSON, it's already JSON.
– GreyBeardedGeek
Nov 24 '18 at 11:43
Oh, and you also can't do an http get of something that's in your app's assets folder, because it's compiled into the Angular app, which is running in the browser.
– GreyBeardedGeek
Nov 24 '18 at 11:51
@Bm8's answer is correct, but you have a few additional issues. First, headers.append() returns a new Headers object, it doesn't modify the old one. So your headers will not be sent. Second, the default port for the Angular dev server is 4200, so it's unlikely that your back end server is on that port. Third, you don't need to map the result of the http call to JSON, it's already JSON.
– GreyBeardedGeek
Nov 24 '18 at 11:43
@Bm8's answer is correct, but you have a few additional issues. First, headers.append() returns a new Headers object, it doesn't modify the old one. So your headers will not be sent. Second, the default port for the Angular dev server is 4200, so it's unlikely that your back end server is on that port. Third, you don't need to map the result of the http call to JSON, it's already JSON.
– GreyBeardedGeek
Nov 24 '18 at 11:43
Oh, and you also can't do an http get of something that's in your app's assets folder, because it's compiled into the Angular app, which is running in the browser.
– GreyBeardedGeek
Nov 24 '18 at 11:51
Oh, and you also can't do an http get of something that's in your app's assets folder, because it's compiled into the Angular app, which is running in the browser.
– GreyBeardedGeek
Nov 24 '18 at 11:51
add a comment |
1 Answer
1
active
oldest
votes
0
You have to provide it to your components module.
declarations: [YourComponent],
providers: [MysqlService]
answered Nov 24 '18 at 10:29
Bm8Bm8
82
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53457165%2fangular-7-connecting-mysql%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
0
You have to provide it to your components module.
declarations: [YourComponent],
providers: [MysqlService]
answered Nov 24 '18 at 10:29
Bm8Bm8
82
add a comment |
0
You have to provide it to your components module.
declarations: [YourComponent],
providers: [MysqlService]
answered Nov 24 '18 at 10:29
Bm8Bm8
82
add a comment |
0
0
0
You have to provide it to your components module.
declarations: [YourComponent],
providers: [MysqlService]
answered Nov 24 '18 at 10:29
Bm8Bm8
82
You have to provide it to your components module.
declarations: [YourComponent],
providers: [MysqlService]
answered Nov 24 '18 at 10:29
Bm8Bm8
82
answered Nov 24 '18 at 10:29
Bm8Bm8
82
answered Nov 24 '18 at 10:29
Bm8Bm8
82
answered Nov 24 '18 at 10:29
Bm8Bm8
82
82
add a comment |
add a comment |
draft saved
draft discarded
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53457165%2fangular-7-connecting-mysql%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
@Bm8's answer is correct, but you have a few additional issues. First, headers.append() returns a new Headers object, it doesn't modify the old one. So your headers will not be sent. Second, the default port for the Angular dev server is 4200, so it's unlikely that your back end server is on that port. Third, you don't need to map the result of the http call to JSON, it's already JSON.
– GreyBeardedGeek
Nov 24 '18 at 11:43
Oh, and you also can't do an http get of something that's in your app's assets folder, because it's compiled into the Angular app, which is running in the browser.
– GreyBeardedGeek
Nov 24 '18 at 11:51