Convert JSON file to Typecript Array of Objects

Question

I am reading in a JSON file and attempting to convert them to an array of objects. I get a syntax error on the component file.

This is the component code

import * as blogs from '../story/stories.json';
import { IStory } from '../models/story';

@Component({
  selector: 'app-story',
  templateUrl: './story.component.html',
  styleUrls: ['./story.component.scss']
})
export class StoryComponent implements OnInit {
  stories: IStory[] ;
  constructor() { }

  ngOnInit() {
    this.stories = blogs; <-- syntax error on this line
      
  }

this is the story.ts file:

export interface IStory {
    id: number;
    author: string;
    title: string;
    pictureUrl: string;
    body: string;
  }

This is the JSON file, stories.json:

[
{"date":3,"author":"AVC", "pictureUrl":"Scorching", "title":"Scorching", "body":"Scorching"},
{"date":4,"author":"ADF", "pictureUrl":"Scorching", "title":"Scorching", "body":"Scorching"}
]

@pc_coder this is the line: import * as blogs from '../story/stories.json'; — Lee9287
– Lee9287, Commented Jun 26, 2020 at 21:43
I did console.log(blogs) and it is printed out as the json file — Lee9287
– Lee9287, Commented Jun 26, 2020 at 21:44

Cagri Tacyildiz · Accepted Answer · 2020-06-26 21:44:47Z

1

Demo try to map to interface

this.stories = this.blogs.map(x=> {return {author:x.author,title:x.title,pictureUrl:x.pictureUrl,body:x.body,id:null}});

answered Jun 26, 2020 at 21:44

Cagri Tacyildiz

17.7k6 gold badges38 silver badges61 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Lee9287 Over a year ago

I changed the this.blogs to blogs . it works. Thanks

Collectives™ on Stack Overflow

Convert JSON file to Typecript Array of Objects

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related