Wir können die Ansicht für check markieren und detechchange aufrufen.
%Vor%Verwenden von Angular v2.4.8 und PrimeNg v1.1.4
Ich habe eine Seite mit zwei Komponenten:
Ich habe Dropzone konfiguriert, um 5 Dateien gleichzeitig zu senden, und wenn es mit 5 Dateien fertig ist, wird das Ereignis onDropZoneSendingMultiple ausgelöst. Wenn alle Dateien hochgeladen sind, wird onDropZoneQueueComplete ausgelöst.
In beiden Listenern möchte ich die Datentabelle aktualisieren, die sich in der zweiten Komponente befindet. Das funktioniert nicht. Ich muss die Seite aktualisieren, um die neuen Dateien zu sehen.
Mein HTML der Hauptseite:
%Vor% Die Dropzone -Komponente zeigt die Dropzone. Die FilesList zeigt die Datentabelle an.
Teil des HTML:
In meiner Haupt-ts-Datei habe ich:
%Vor%In meiner Dateiliste habe ich
%Vor% getFiles wird auch beim Laden der Seite aufgerufen.
Wenn ich console.log() -Anweisungen hinzufüge, kann ich sehen, dass getFiles() aufgerufen wird und this.files aktualisiert wird, aber die Tabelle nicht aktualisiert wird.
Für alle, die immer noch nach der neuen Syntax zum Hinzufügen von Datensätzen zu einem Array suchen, das an eine Primeng-Tabelle gebunden ist
this.arrayRecords= [...this.arrayRecords, newObject];
Update : PrimeNG hat kürzlich die DoCheck-Schnittstelle entfernt, die Änderungen automatisch erkannt hat, siehe: Ссылка
Die Antwort ist die Verwendung des Spread-Operators ([... arr] - Ссылка ), um Elemente zu Ihrem Array anstelle von .push () hinzuzufügen.
Ursprüngliche Antwort : Ich hatte ein ähnliches Problem, das ich mit einem etwas anderen Ansatz gelöst habe. Wenn Sie den gleichen Dienst zum Hochladen und Abrufen Ihrer Dateien verwenden, können Sie RxJS verwenden, anstatt Ereignisse über Komponenten hinweg zu hören.
Auf meinen Diensten möchte ich über die App neu laden, wenn ich einen POST oder PUT mache, den ich benutze:
%Vor%In Ihren POST- und / oder PUT-Methoden
%Vor%Mit dieser Option können Sie das FileService.shouldUpdateObservable in Ihren Komponenten abonnieren:
%Vor%Dies scheint der beste Weg zu sein, die Kommunikation über einen Dienst zwischen Komponenten, die ich gesehen / benutzt habe, zu handhaben.
-Edit-
Hier ist das gleiche Konzept in der offiziellen Dokumentation:
Ссылка
-Edit 2- Ich habe dieses Problem nach der Aktualisierung auf 4.0.0 erneut behoben. FWIW, ich entfernte das PrimeNG-Datatable, stattdessen ein Handbuch * ngFor und es hat gut funktioniert. Es scheint, dass die PrimeNg-Dokumentation ( Ссылка ) dir sagt:
"Verwenden Sie zum Beispiel beim Entfernen eines Elements anstelle von Spleißen die Option slice oder verwenden Sie beim Hinzufügen eines Elements den Spread-Operator anstelle der Push-Methode."
Ich bin mir nicht sicher, warum sie Sie darum bitten, weil dies im Gegensatz zu der offiziellen Angular-Dokumentation steht, aber ich glaube, es hat etwas damit zu tun, warum die [value] -Bindung nicht so funktioniert, wie Sie es erwarten würden .
Persönlich entferne ich mich von PrimeNg zugunsten der Kovalenz Datentabelle, die eine explizite refresh () Funktion hat: Ссылка
Ich vermute, dass dies damit zu tun hat, wie Ihre Kindkomponente Änderungen verarbeitet. Sie sollten das onChange-Ereignis implementieren und die Dateien auf diese Weise festlegen. Hier ist ein Beispiel:
'' '
%Vor%'' '
UPDATE :
Ich habe mir die Dokumentation für p-dataTable genauer angeschaut, insbesondere den Abschnitt Change Detection. Ich habe das Attribut [immutable]=false -Attribut im Tag p-dataTable entfernt und stattdessen erhalte ich jetzt die Tabelle zum Aktualisieren, indem ich so etwas zurückgebe, wenn ich das zugrunde liegende Array modifiziere:
return myOriginalArray.slice();
ORIGINAL :
Ich hatte Probleme damit, p-datatable zu aktualisieren / zu aktualisieren, wenn ich ein Element aus dem zugrunde liegenden Array entfernte, das zum Auffüllen der Tabelle verwendet wurde. Keine Ahnung, warum, aber das Hinzufügen des folgenden Attributs zum p-datatable -Tag bestimmte Dinge für mich:
[immutable]=false
Ich benutze PrimeNG ^ 4.1.3
Für alle, die immer noch nach der neuen Syntax zum Hinzufügen von Datensätzen zu einem Array suchen, das an eine Primeng-Tabelle gebunden ist
%code%
Verwenden von Angular v2.4.8 und PrimeNg v1.1.4
Ich habe eine Seite mit zwei Komponenten:
Ich habe Dropzone konfiguriert, um 5 Dateien gleichzeitig zu senden, und wenn es mit 5 Dateien fertig ist, wird das Ereignis %code% ausgelöst. Wenn alle Dateien hochgeladen sind, wird %code% ausgelöst.
In beiden Listenern möchte ich die Datentabelle aktualisieren, die sich in der zweiten Komponente befindet. Das funktioniert nicht. Ich muss die Seite aktualisieren, um die neuen Dateien zu sehen.
Mein HTML der Hauptseite:
%Vor%Die %code% -Komponente zeigt die Dropzone. Die %code% zeigt die Datentabelle an. Teil des HTML:
%Vor%In meiner Haupt-ts-Datei habe ich:
%Vor%In meiner Dateiliste habe ich
%Vor%%code% wird auch beim Laden der Seite aufgerufen. Wenn ich %code% -Anweisungen hinzufüge, kann ich sehen, dass %code% aufgerufen wird und %code% aktualisiert wird, aber die Tabelle nicht aktualisiert wird.
Update : PrimeNG hat kürzlich die DoCheck-Schnittstelle entfernt, die Änderungen automatisch erkannt hat, siehe: Ссылка
Die Antwort ist die Verwendung des Spread-Operators ([... arr] - Ссылка ), um Elemente zu Ihrem Array anstelle von .push () hinzuzufügen.
Ursprüngliche Antwort : Ich hatte ein ähnliches Problem, das ich mit einem etwas anderen Ansatz gelöst habe. Wenn Sie den gleichen Dienst zum Hochladen und Abrufen Ihrer Dateien verwenden, können Sie RxJS verwenden, anstatt Ereignisse über Komponenten hinweg zu hören.
Auf meinen Diensten möchte ich über die App neu laden, wenn ich einen POST oder PUT mache, den ich benutze:
%Vor%In Ihren POST- und / oder PUT-Methoden
%Vor%Mit dieser Option können Sie das FileService.shouldUpdateObservable in Ihren Komponenten abonnieren:
%Vor%Dies scheint der beste Weg zu sein, die Kommunikation über einen Dienst zwischen Komponenten, die ich gesehen / benutzt habe, zu handhaben.
-Edit-
Hier ist das gleiche Konzept in der offiziellen Dokumentation:
Ссылка
-Edit 2- Ich habe dieses Problem nach der Aktualisierung auf 4.0.0 erneut behoben. FWIW, ich entfernte das PrimeNG-Datatable, stattdessen ein Handbuch * ngFor und es hat gut funktioniert. Es scheint, dass die PrimeNg-Dokumentation ( Ссылка ) dir sagt:
"Verwenden Sie zum Beispiel beim Entfernen eines Elements anstelle von Spleißen die Option slice oder verwenden Sie beim Hinzufügen eines Elements den Spread-Operator anstelle der Push-Methode."
Ich bin mir nicht sicher, warum sie Sie darum bitten, weil dies im Gegensatz zu der offiziellen Angular-Dokumentation steht, aber ich glaube, es hat etwas damit zu tun, warum die [value] -Bindung nicht so funktioniert, wie Sie es erwarten würden .
Persönlich entferne ich mich von PrimeNg zugunsten der Kovalenz Datentabelle, die eine explizite refresh () Funktion hat: Ссылка
Wir können die Ansicht für check markieren und detechchange aufrufen.
%Vor%UPDATE : Ich habe mir die Dokumentation für p-dataTable genauer angeschaut, insbesondere den Abschnitt Change Detection. Ich habe das Attribut %code% -Attribut im Tag %code% entfernt und stattdessen erhalte ich jetzt die Tabelle zum Aktualisieren, indem ich so etwas zurückgebe, wenn ich das zugrunde liegende Array modifiziere:
%code%
ORIGINAL : Ich hatte Probleme damit, %code% zu aktualisieren / zu aktualisieren, wenn ich ein Element aus dem zugrunde liegenden Array entfernte, das zum Auffüllen der Tabelle verwendet wurde. Keine Ahnung, warum, aber das Hinzufügen des folgenden Attributs zum %code% -Tag bestimmte Dinge für mich:
%code%
Ich benutze PrimeNG ^ 4.1.3
Ich vermute, dass dies damit zu tun hat, wie Ihre Kindkomponente Änderungen verarbeitet. Sie sollten das onChange-Ereignis implementieren und die Dateien auf diese Weise festlegen. Hier ist ein Beispiel:
'' '
%Vor%'' '