Thank you so much sir....in other videos we cant find coding accordingly with proper structure which dey dont call api from service or directly call from component....but you sir, followed mvc arch....im coding along with the video where i acheived best practice...a simple thanks is not enough sir...my respects to u sir...learnt a lot from ur tuts..
Thanks :) . Yes I have created one video on Template Driven forms th-cam.com/video/U-OL1YMxUrU/w-d-xo.html I will be coming up with tutorials on Reactive forms and form validations as well.
Really great videos! It helps a lot to get my head around Angular. I also like that you misspell sometimes. Because it helps when I write an error. Then I know what is up and how to correct it. Thank you for posting them!
Sir, thank you. You put this video out, the perfect time I needed it the most. It was like Lord Krishna came to save me and guide me. Thank you once again.
Hi Naveen, to debug first check if you are getting the JSON response correct, as it seems that the response is either not correct or some error in parsing that is why the runtime error comes up.
Hai sir, the error has gone. At the time of template loading, the countryObj is undefined(does not have any value). So atleast, I have to intialize an empty countryObj i.e countryObj:any={};
Hi Kurama, you can use .catch( yourCustomErrorHandler) method chained to the get method here. The 'yourCustomErrorHandler is the custom error handler defined by you which implicitly passes an error object as an argument to the custom error handler. I will implement error handler in my future tutorials whereever I would be using the REST API calls to demonstrate.
excellent explanation Sir I have multiple links just like buttons when i click buttons related data should show, not complete json array keys, keys are same, Please give me any solution? my json [{ "one" : { "name": "one", "status": "Status" }, "two" : { "name": "two", "status": "Status" }, "three" :{ "name": "three", "status": Status" },"four" : { "name": "four", "status": "Status" }}]
Hi Junaid, how to make this link dynamic and make get place_name list to show in selectbox. THANKS raw.githubusercontent.com/Elkfox/Australian-Postcode-Data/master/au_postcodes.json
You can try this to get the list of place names in the select dropdown box: Create a service say countries.service.ts: import { Injectable } from '@angular/core'; import { Http, Response } from '@angular/http'; import 'rxjs/add/operator/map'; @Injectable() export class CountriesService { private countriesUrl = 'restcountries.eu/rest/v2/name/india?fullText=true'; constructor( private _http: Http ) { } public getCountryDetail () { return this._http.get( this.countriesUrl ).map((res: Response) => res.json()); } public getPlaceNames() { const placeUrl = 'raw.githubusercontent.com/Elkfox/Australian-Postcode-Data/master/au_postcodes.json'; return this._http.get(placeUrl); } } In app.component.htm template put the following control element: Place Names {{places.place_name}}
============================================================================== App.component.ts: import { Component, AfterViewInit } from '@angular/core'; import { CountriesService } from './services/countries.service'; @Component({ selector: 'app-root', templateUrl: './app.component.html', providers: [CountriesService] }) export class AppComponent implements AfterViewInit { title = 'Places Demo'; public postCodes: any; constructor ( private countriesService: CountriesService ) { } ngAfterViewInit(){ this.countriesService.getPlaceNames().subscribe(res=> this.diplsplayPlaces(res.json())); } private diplsplayPlaces( places: any ) { this.postCodes = places; } }
In countries service you can omit the other codes... You can just use: Create a service say countries.service.ts: import { Injectable } from '@angular/core'; import { Http, Response } from '@angular/http'; import 'rxjs/add/operator/map'; @Injectable() export class CountriesService { constructor( private _http: Http ) { } public getPlaceNames() { const placeUrl = 'raw.githubusercontent.com/Elkfox/Australian-Postcode-Data/master/au_postcodes.json'; return this._http.get(placeUrl); } }
Thank you so much sir....in other videos we cant find coding accordingly with proper structure which dey dont call api from service or directly call from component....but you sir, followed mvc arch....im coding along with the video where i acheived best practice...a simple thanks is not enough sir...my respects to u sir...learnt a lot from ur tuts..
Really helpful video for beginners
This is gold, thanks a lot!
Great video, really awesome and detailed explication keep it up.
Excellent videos.Super way of teaching
Thanks Bikash :)
Great Video , Neatly Explained ...keep it up !
Thanks Pratap :)
great videos ur
explnation is quitegood sir
Thanks alot for explaining each and everything in very clean....
Thanks Pradeep :)
Good stuff Thanks!! watch it in 1.5x to save some time
Your awesome man... keep it up!
Thanks Peter :)
Thank you Junaid
Thanks sir, good video
great job sir please upload observables and rxjs
another great video. hope you will do video on forms and reactive forms with validations soon. THANKS
Thanks :) . Yes I have created one video on Template Driven forms
th-cam.com/video/U-OL1YMxUrU/w-d-xo.html
I will be coming up with tutorials on Reactive forms and form validations as well.
Really great videos! It helps a lot to get my head around Angular.
I also like that you misspell sometimes. Because it helps when I write an error. Then I know what is up and how to correct it. Thank you for posting them!
fnils Thanks and glad to know that you liked my videos 😊
Great job, thank you :)
Thanks :)
Really good video. Saved me a lot of money. Perfect time of Upload Sir. Cheers.
Thanks Viral. Really glad to know that you liked the video and it was helpful. Thanks for taking time out to watch my video tutorial.
Sir, thank you. You put this video out, the perfect time I needed it the most. It was like Lord Krishna came to save me and guide me. Thank you once again.
thanks this is really helpful
Awesome Tutorial sir. Really like the way u explain.
Thanks :)
Thanks
hello junaid alam
i getting the error in my component.ts file that "-Cannot find name 'res'-".
Hi Sumit, what is the full error message?
i have resolve that issue i need help in post (tutorial no:11) plz help me for that
sir im getting error. please help me. the error is:: Runtime Error
Cannot read property 'capital' of undefined
Hi Naveen, to debug first check if you are getting the JSON response correct, as it seems that the response is either not correct or some error in parsing that is why the runtime error comes up.
Hai sir, the error has gone. At the time of template loading, the countryObj is undefined(does not have any value). So atleast, I have to intialize an empty countryObj i.e countryObj:any={};
ok great :)
sir when the angular 5 will be released?
It is already released.
hi boss can you show how to handle the error for this one thanks in advance
Hi Kurama, you can use .catch( yourCustomErrorHandler) method chained to the get method here. The 'yourCustomErrorHandler is the custom error handler defined by you which implicitly passes an error object as an argument to the custom error handler. I will implement error handler in my future tutorials whereever I would be using the REST API calls to demonstrate.
thanks buddy
excellent explanation Sir I have multiple links just like buttons when i click buttons related data should show, not complete json array keys, keys are same, Please give me any solution? my json [{
"one" : { "name": "one", "status": "Status" }, "two" : { "name": "two", "status": "Status" }, "three" :{ "name": "three", "status": Status" },"four" : { "name": "four", "status": "Status" }}]
Hi Junaid, how to make this link dynamic and make get place_name list to show in selectbox. THANKS raw.githubusercontent.com/Elkfox/Australian-Postcode-Data/master/au_postcodes.json
Junaid. can you please leave your email id skype id. need to discuss regarding a project. thanks
Hi, The link that you provided does not opens and gives 404 error.
Thanks for quick reply, i got the link from github please check this > github.com/Elkfox/Australian-Postcode-Data and click on .json file.
You can try this to get the list of place names in the select dropdown box:
Create a service say countries.service.ts:
import { Injectable } from '@angular/core';
import { Http, Response } from '@angular/http';
import 'rxjs/add/operator/map';
@Injectable()
export class CountriesService {
private countriesUrl = 'restcountries.eu/rest/v2/name/india?fullText=true';
constructor( private _http: Http ) { }
public getCountryDetail () {
return this._http.get( this.countriesUrl ).map((res: Response) => res.json());
}
public getPlaceNames() {
const placeUrl = 'raw.githubusercontent.com/Elkfox/Australian-Postcode-Data/master/au_postcodes.json';
return this._http.get(placeUrl);
}
}
In app.component.htm template put the following control element:
Place Names
{{places.place_name}}
==============================================================================
App.component.ts:
import { Component, AfterViewInit } from '@angular/core';
import { CountriesService } from './services/countries.service';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
providers: [CountriesService]
})
export class AppComponent implements AfterViewInit {
title = 'Places Demo';
public postCodes: any;
constructor ( private countriesService: CountriesService ) { }
ngAfterViewInit(){
this.countriesService.getPlaceNames().subscribe(res=> this.diplsplayPlaces(res.json()));
}
private diplsplayPlaces( places: any ) {
this.postCodes = places;
}
}
In countries service you can omit the other codes... You can just use:
Create a service say countries.service.ts:
import { Injectable } from '@angular/core';
import { Http, Response } from '@angular/http';
import 'rxjs/add/operator/map';
@Injectable()
export class CountriesService {
constructor( private _http: Http ) { }
public getPlaceNames() {
const placeUrl = 'raw.githubusercontent.com/Elkfox/Australian-Postcode-Data/master/au_postcodes.json';
return this._http.get(placeUrl);
}
}
sir im getting error. please help me Error: No provider for ConnectionBackend!