PrimeNG dataTable '테이블을 다시로드하지 않습니다'

Question

템플릿에 dataTable에 대해 [value]="rows[indexString]"이 있습니다.

rows: any = {} 
newrow: any = {} 
... 
addNewRow(key: string) { 

    let rows = {...this.rows} 
    let newrow = {_key: Math.floor(Math.random() * 10000), title: this.newrow.title} 

    if (rows[key]) { 
    rows[key].push(newrow) 
    } else { 
    rows[key] = newrow 
    } 

    this.rows = rows 

} 

기본적으로 템플릿 {{rows | json}}에, 테이블에서 렌더링 만 첫 번째 행 here

에서 튜토리얼 다음입니다 구성 요소에서 는 모든이있다 :

귀하의 경우

{ 
    "210386": [ 
    { 
     "_key": 9173, 
     "title": "Row one" 
    }, 
    { 
     "_key": 6201, 
     "title": "Row Two" 
    } 
    ] 
} 

Answer 1

는 this.rows가있다 object, array이 아닙니다.

문제는 복사하는 방법이 될 수 있다고 생각합니다. this.rows. this.rows 복사본에서 새 개체를 만들려면 스프레드 연산자를 사용하고 있습니다. 원하는 것은 배열입니다.

이 대신보십시오 :

let rows = [...this.rows] 

편집 : 나는 내 대답을 완료 할 수 있습니다. 문제는 행을 복사 할 때 객체를 다시 할당하고 해당 객체를 재 할당하는 것입니다. 그러면 변화를 관찰 할 수 없습니다.

복사해야하는 것은 현재 작업중인 어레이입니다. 전체 개체가 아닙니다.

addNewRow(key: string) { 

    let newrow = {_key: Math.floor(Math.random() * 10000), title: this.newrow.title} 

    let rows = []; 

    if (this.rows.hasOwnProperty(key)) { // check is key already exists 
     rows = [...this.rows[key], newRow]; 
    } else { 
     rows = [newRow] 
    } 

    this.rows[key] = rows; 

    }