【问题标题】:Create Array from objects in angular js从角度js中的对象创建数组
【发布时间】:2019-10-16 15:55:44
【问题描述】:

我是这个框架的新手。我想将对象转换为角度 8 的数组。但我不明白这是如何工作的。

实际上,我想显示状态为 false 的客户的多个销售交易。 因此,我以某种方式将同一客户进行的那些交易的价值作为单独的不同对象获得。 现在,我想将这些对象转换为单个数组,以便可以通过 *ngFor 在 html 文件中迭代它们。

  export class InvoicesComponent implements OnInit {

  displayedColumns: string[] = ['ProductName', 'CustomerName', 'Quantity', 
  'Rate', 'Total'];
  id;
  dataSource;


  salesTransaction: SalesTransactionElement[];
  constructor(private service: SalesTransactionsService,
          private route: ActivatedRoute) 
  { }

ngOnInit() {

this.id = this.route.snapshot.paramMap.get('id');

this.service.getSalesTransaction(this.id).subscribe((singleData: any) =>
{
  this.service.getAllSalesTransactions().subscribe((data: any) => 
  {
    data.forEach(element => 
     {

      if (singleData.CustomerName === element.CustomerName && 
      element.Status === false) {

        this.salesTransaction = element;
        console.log(this.salesTransaction);
      }

    });
  });
}

实际结果:

/*****分别作为两个对象****/

{SalesTranId: 54, ProductId: 10, CustomerId: 21, InvoiceId: null, ProductName: "Asus"}

{SalesTranId: 51, ProductId: 17, CustomerId: 21, InvoiceId: 1, ProductName: "Dell"}

预期结果:

/**********对象数组************/

[{SalesTranId: 54, ProductId: 10, CustomerId: 21, InvoiceId: null, ProductName: "Asus"},

{SalesTranId: 51, ProductId: 17, CustomerId: 21, InvoiceId: 1, ProductName: "Dell"}]

【问题讨论】:

  • 这与 Angular / AngularJs 无关,您应该删除这些标签。这只是关于 Javascript 中的数组处理。
  • 使用空数组 [ ] 初始化 salesTransaction 变量,而不是分配即 this.salesTransaction = element ,试试 this.salesTransaction.push(element)。此外,在订阅中订阅也是一种不好的做法,您可以根据您的用例尝试使用 RxJs 运算符方法“flatMap”或“forkJoin”。
  • tq 太有效了。

标签: arrays typescript object


【解决方案1】:

初始化构造函数上方的数组:salesTransaction: SalesTransactionElement[] = []

然后在 forEach 处理程序中推入该数组:this.salesTransaction.push(element);

【讨论】:

    【解决方案2】:

    实际上,您在 SalesTransactionElement[] 的数组定义中分配了一个对象,因此您需要推送一个 SalesTransactionElement。

    export class InvoicesComponent implements OnInit {
    
      displayedColumns: string[] = ['ProductName', 'CustomerName', 'Quantity', 
      'Rate', 'Total'];
      id;
      dataSource;
    
    
      salesTransaction: SalesTransactionElement[];
      constructor(private service: SalesTransactionsService,
              private route: ActivatedRoute) 
      { }
    
    ngOnInit() {
    
    this.id = this.route.snapshot.paramMap.get('id');
    
    this.service.getSalesTransaction(this.id).subscribe((singleData: any) =>
    {
      this.service.getAllSalesTransactions().subscribe((data: any) => 
      {
        data.forEach(element => 
         {
    
          if (singleData.CustomerName === element.CustomerName && 
          element.Status === false) {
    
            this.salesTransaction.push(element);
          }
    
        });
      });
    }
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2021-02-20
      • 2019-07-17
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多