Question

在之前的角度版本中我们有$ scope.apply来检测更改，所以我在下面的代码我有来自detailService的数据，现在打印我正在推送数据到对象它的抛出错误对象属性是未定义的，什么是新的正确方法角度版本将数据推送到数组并将其绑定到dom？

app.component.ts

  import { Component, OnInit,Pipe, PipeTransform, EventEmitter, Output } from '@angular/core';
import { DetailService } from '../detail.service';
import { StreamService } from '../stream.service';
import { MatTableDataSource } from '@angular/material';
import {GtConfig} from '@angular-generic-table/core';
import { GenericTableComponent} from '@angular-generic-table/core';
import * as io from 'socket.io-client';


export interface Element {
        ticketNum: number;
        ticketOpened: number;
        eventType: string;
        riskIndex: string;
        riskValue: number;
        severity: string;
        lastModifiedDate: number;
        assetID: string;
    }
    @Component({
      selector: 'app-detail',
      templateUrl: './detail.component.html',
      styleUrls: ['./detail.component.css'],

    })
export class DetailComponent{
  messageArray: any[];
    message1:Object = {};
   public secondConfigObject: GtConfig<any>;

    constructor(private detailService: DetailService) {
        this.secondConfigObject = {
            settings: this.getBaseSettings(),
            fields: this.getBaseFields(),
            data: []
        };
    };

    ngOnInit() {
        this.detailService.currentMessage1.subscribe(message1 => {
            console.log('eventINDetailComp',message1);
            this.secondConfigObject.data.push(message1);
        });
    }

}

app.component.html

<div class="table-responsive">
    <generic-table [gtClasses]="'table-hover'" #myCustomTable [gtSettings]="secondConfigObject.settings" [gtFields]="secondConfigObject.fields" [gtData]="secondConfigObject.data"></generic-table>
</div>

Answer 1

您应该将代码从构造函数移动到ngOnInit()函数的开头，以便在创建页面后设置数据，而不是在此期间设置。

对于数据绑定，屏幕/ html上的变量会在后面的代码中更改时自动更新

如何推送数据并检测角度2 +版本的变化？

1 个答案: