How to Read Local JSON file in Angular | JSON File in Angular

hello friends in this video we'll see how we can't read look at this and find angular so whenever we want to so some static gatoring uh we don't need to call it from server we can store it in JSON file and we can read it into that so at first you can see here I have a default boilerplate of angular generated from the CLI command and at first I am going to create a dummy list of files I'll create a list of countries and which I'll sew into the template so yeah I'm just copying this value chunk of it here now since the data is loaded into the app so I'll call it into a component fighter-pilot important countries from if both files countries adjacent now I define the variable so come true is that an array object and object will hold name of type string is the continuum and code of type string the country code which is available in our JSON file and the value will be assigned to countries okay so I think we have written with the tasks in this file and here we can see this now error is coming over the import line so this error is coming because the angular doesn't recognize JSON file and the counter in JSON file by default so we need to enable this in our angular app so for that we need to create a file the name of the file be JSON type I typing or DTS just name the file as it is you don't need to do anything with it and just copy this code and put it don't need to go inside this code it's just enabling the JSON format files to read in T into our application it's a thesis so you need to go inside the things so now I've got done with the the tasks at the logical part now we have to bind this data meanwhile I am starting the app also for that it will compile in meanwhile so now I will bind the data so deep and inside there let's say I'm taking BTech okay and here I'll take the value and you fall late fighting off control assess the variable name the component so now I will bind the data it will be item dot name the name of the country and I jumped out coat I think that's it for now we are done with all the stuff ninja so let's check the app so you can see you can see our app has been compiled you know if you'd only open photo double zero you can see we have list of the countries and here we have the name and code so this way we can use listen file locally and open to our angular app ok that's it for now thanks watching this video

Channel: JsonWorld

Views: 38,131

Keywords: read json file in angular 8, how to read json file in angular, how to read json file in angular 8, Angular sample application, Angular tutorial, Angular 8 Apps, json file in angular, import json file in angular, display data from json file in angular, Angular tutorials, Angular course, Angular updates, using local file in Angular, optimize app developed in Angular, Angular tips, Angular SPAs, Learn Angular, angular tutorial for beginners, angular design, angular and react

Id: 88b0hW6I9sk

Length: 3min 54sec (234 seconds)

Published: Tue May 12 2020