typescript 如何在角度 2 中创建模型,其中包含对象数组

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/39854230/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-21 03:53:59  来源:igfitidea点击:

how to create Model in angular 2 with array of object in it

angulartypescript

提问by Malik Kashmiri

I am trying to create a model for this response to store data into model and the use it as required

我正在尝试为此响应创建一个模型以将数据存储到模型中并根据需要使用它

Response

回复

[
  {
    "Id": 0,
    "ApimId": "5746ebcfcd7c3209247edc40",
    "Name": "Atea Service Desk",
    "Description": "Service Desk and Operations",
    "SubscriptionRequired": false,
    "ApprovalRequired": false,
    "State": "published",
    "Apis": [
      {
        "Id": 0,
        "ApimId": "5746ba28804136004d040001",
        "Name": "Echo API",
        "Description": null,
        "ServiceUrl": "http://echoapi.cloudapp.net/api",
        "ScopeId": 0,
        "WorkflowId": 0,
        "Workflow": null,
        "Scope": null,
        "CreatedDate": "2016-10-04T18:49:32.2553822+05:00",
        "CreatedBy": "LHR\ahja",
        "UpdatedDate": "2016-10-04T18:49:32.2553822+05:00",
        "UpdatedBy": "LHR\ahja"
      },
      {
        "Id": 0,
        "ApimId": "574c167dcd7c3216c8c633b3",
        "Name": "Servicedesk and Operations",
        "Description": "Atea Servicedesk and Operations Internal API",
        "ServiceUrl": "http://dev-endpoint.atea.com/RFC",
        "ScopeId": 0,
        "WorkflowId": 0,
        "Workflow": null,
        "Scope": null,
        "CreatedDate": "2016-10-04T18:49:32.2564039+05:00",
        "CreatedBy": "LHR\ahja",
        "UpdatedDate": "2016-10-04T18:49:32.2564039+05:00",
        "UpdatedBy": "LHR\ahja"
      },
      {
        "Id": 0,
        "ApimId": "574eb044cd7c320600975d85",
        "Name": "Swagger Petstore",
        "Description": "This is a sample server Petstore server.  You can find out more about Swagger at [http://swagger.io](http://swagger.io) or on [irc.freenode.net, #swagger](http://swagger.io/irc/).  For this sample, you can use the api key `special-key` to test the authorization filters.",
        "ServiceUrl": "http://petstore.swagger.io/v2",
        "ScopeId": 0,
        "WorkflowId": 0,
        "Workflow": null,
        "Scope": null,
        "CreatedDate": "2016-10-04T18:49:32.2574041+05:00",
        "CreatedBy": "LHR\ahja",
        "UpdatedDate": "2016-10-04T18:49:32.2574041+05:00",
        "UpdatedBy": "LHR\ahja"
      },
      {
        "Id": 0,
        "ApimId": "574eb27fcd7c320600975d86",
        "Name": "Swagger Petstore API",
        "Description": "This API is design by Swagger.io",
        "ServiceUrl": "http://petstore.swagger.wordnik.com/api",
        "ScopeId": 0,
        "WorkflowId": 0,
        "Workflow": null,
        "Scope": null,
        "CreatedDate": "2016-10-04T18:49:32.2584048+05:00",
        "CreatedBy": "LHR\ahja",
        "UpdatedDate": "2016-10-04T18:49:32.2584048+05:00",
        "UpdatedBy": "LHR\ahja"
      }
    ],
    "CreatedDate": "2016-10-04T18:49:32.2594056+05:00",
    "CreatedBy": "LHR\ahja",
    "UpdatedDate": "2016-10-04T18:49:32.2594056+05:00",
    "UpdatedBy": "LHR\ahja"
  },
  {
    "Id": 0,
    "ApimId": "57eb9930cd7c320760ee317e",
    "Name": "Non Workflow",
    "Description": "Workflow not applied to the contained APIs",
    "SubscriptionRequired": false,
    "ApprovalRequired": false,
    "State": "published",
    "Apis": [
      {
        "Id": 0,
        "ApimId": "574eb044cd7c320600975d85",
        "Name": "Swagger Petstore",
        "Description": "This is a sample server Petstore server.  You can find out more about Swagger at [http://swagger.io](http://swagger.io) or on [irc.freenode.net, #swagger](http://swagger.io/irc/).  For this sample, you can use the api key `special-key` to test the authorization filters.",
        "ServiceUrl": "http://petstore.swagger.io/v2",
        "ScopeId": 0,
        "WorkflowId": 0,
        "Workflow": null,
        "Scope": null,
        "CreatedDate": "2016-10-04T18:49:32.8218186+05:00",
        "CreatedBy": "LHR\ahja",
        "UpdatedDate": "2016-10-04T18:49:32.8218186+05:00",
        "UpdatedBy": "LHR\ahja"
      },
      {
        "Id": 0,
        "ApimId": "574eb27fcd7c320600975d86",
        "Name": "Swagger Petstore API",
        "Description": "This API is design by Swagger.io",
        "ServiceUrl": "http://petstore.swagger.wordnik.com/api",
        "ScopeId": 0,
        "WorkflowId": 0,
        "Workflow": null,
        "Scope": null,
        "CreatedDate": "2016-10-04T18:49:32.8228184+05:00",
        "CreatedBy": "LHR\ahja",
        "UpdatedDate": "2016-10-04T18:49:32.8228184+05:00",
        "UpdatedBy": "LHR\ahja"
      }
    ],
    "CreatedDate": "2016-10-04T18:49:32.8238186+05:00",
    "CreatedBy": "LHR\ahja",
    "UpdatedDate": "2016-10-04T18:49:32.8238186+05:00",
    "UpdatedBy": "LHR\ahja"
  },
  {
    "Id": 0,
    "ApimId": "5746ba28804136004d060001",
    "Name": "Starter",
    "Description": "Subscribers will be able to run 5 calls/minute up to a maximum of 100 calls/week.",
    "SubscriptionRequired": false,
    "ApprovalRequired": false,
    "State": "notPublished",
    "Apis": [],
    "CreatedDate": "2016-10-04T18:49:33.4234324+05:00",
    "CreatedBy": "LHR\ahja",
    "UpdatedDate": "2016-10-04T18:49:33.4234324+05:00",
    "UpdatedBy": "LHR\ahja"
  },
  {
    "Id": 0,
    "ApimId": "5746ba28804136004d060002",
    "Name": "Unlimited",
    "Description": "Subscribers have completely unlimited access to the API. Administrator approval is required.",
    "SubscriptionRequired": false,
    "ApprovalRequired": false,
    "State": "published",
    "Apis": [
      {
        "Id": 0,
        "ApimId": "5746ba28804136004d040001",
        "Name": "Echo API",
        "Description": null,
        "ServiceUrl": "http://echoapi.cloudapp.net/api",
        "ScopeId": 0,
        "WorkflowId": 0,
        "Workflow": null,
        "Scope": null,
        "CreatedDate": "2016-10-04T18:49:33.9833659+05:00",
        "CreatedBy": "LHR\ahja",
        "UpdatedDate": "2016-10-04T18:49:33.9833659+05:00",
        "UpdatedBy": "LHR\ahja"
      }
    ],
    "CreatedDate": "2016-10-04T18:49:33.9843647+05:00",
    "CreatedBy": "LHR\ahja",
    "UpdatedDate": "2016-10-04T18:49:33.9843647+05:00",
    "UpdatedBy": "LHR\ahja"
  }
]

I have created two class one is Product and other is Api. Below is my implementation foe these classes.

我创建了两个类,一个是 Product,另一个是 Api。下面是我对这些类的实现。

Api

应用程序接口

export class ApiModel {
    public ProductId: number;
    public Apim: string;
    public Name: string;
    public Description: string;
    public ServiceUrl: string;
    public WorkflowId: number;
    public ScopeId: number;
}

Product

产品

export class ProductModel {
    public Id: number;
    public Apim: string;
    public ApprovalRequired: boolean;
    public Name: string;
    public Description: string;
    public ServiceUrl: string;
    public State: string;
    public SubscriptionRequired: boolean;
    public Apis: Array<any>;
}

Now my question is that It store the response in it. e.g Product have many Apis in it. and if I want to get all the apis in the same product

现在我的问题是它将响应存储在其中。例如,产品中有许多 API。如果我想在同一产品中获得所有 api

回答by Supamiu

You can set object array type using ClassName[]:

您可以使用ClassName[]以下方法设置对象数组类型:

export class Api{
    Id: 0;
    ApimId: string;
    Name: string;
    Description: string;
    ServiceUrl: string;
    ScopeId: number;
    WorkflowId: number;
    Workflow: any;
    Scope: any;
    CreatedDate: string;
    CreatedBy: string;
    UpdatedDate: string;
    UpdatedBy: string;
}

And then in your ProductModel:

然后在你的ProductModel

import {Api} from './api';
export class ProductModel {
    public Id: number;
    public Apim: string;
    public ApprovalRequired: boolean;
    public Name: string;
    public Description: string;
    public ServiceUrl: string;
    public State: string;
    public SubscriptionRequired: boolean;
    public Apis: Api[];
}