在Angular 2中嵌套json数据-如何过滤？

Question

I'm new with Angular, Js etc, and have a problem with understanding how should work with nested data. For example:

I have four json files:

• categories
• subcategories
• posts
• comments

It's better to have 4 different files like above, or one like this:

{
"id_category":"1",
"name":"business",
"subcategories":{
    "id":"1",
    "name":"ecommerse",
    "posts": {
        "id": 1,
        "title": "New post"
        "comments": {
            "id": 1,
            "text": "text text text"
     }
  }
}

Of course it's only an example, but for that example I need to find comment by Id = 1 to get information about which post this comment is related to, which subcategory and category.

Now I have four different files, and services to get data from json files. I can get a specific comment by ID:

getComment(Id: number) {
    return this.comments.find(
        (comment) =>
        comment.id === Id 
    );
}

ok, fine. But If I want to get information about post, subcategory, and main category for this comment? What should I do?

Answer 1

It depends on what the specific needs of your application are.

With this structure:

{
"id_category":"1",
"name":"business",
"subcategories":{
    "id":"1",
    "name":"ecommerse",
    "posts": {
        "id": 1,
        "title": "New post"
        "comments": {
            "id": 1,
            "text": "text text text"
     }
  }
}

You could iterate over Categories and display a list, then allow a user to select a single category , and assign that to var currentCategory .

You could then iterate over currentCategory.subcategories to allow the user to select a subcategory and assign that to var currentSubCategory . You would keep drilling down then into currentSubCategory.posts , allow the user to select a post , assign that to var currentPost and then iterate over that to display currentPost.comments .

If you're fetching from a database in order to allow the user to drill down into the data for display only, then something like this would work.

If you're maintaining data in JSON files, then I would look at something like JSON Server https://github.com/typicode/json-server

If you're building something more substantial and you have a database backend, make use of the database and don't try to recreate that functionality in your JSON, use JSON as a transport for the data, but don't try to replicate entire tables or complex data structures in your front end code, just fetch what you need as you need it, as that will make for a much more stable and scalable application, and will also make it easier for you do fetch and update data in small manageable chunks.

For mocking a data backend using JSON, consider json-server

https://www.npmjs.com/package/json-server