Angular2 / 4 Как да актуализирате шаблона в * ngFor работи върху [обект, обект]? - ъглова, ngfor, ъглова тръба

Имам Json Object like

var obj = {
"TimSays":"I can Walk",
"RyanSays":"I can sing",
"MaxSays":"I can dance",
"SuperSays":"I can do it all"
}

Искам да повторя този обект в шаблона, така че аз съм с помощта на тръба, тъй като няма директен начин да се iterate obj в шаблон в Angular2 / 4

import { Injectable, Pipe } from "@angular/core";
@Pipe({
name: "keyobject"
})
@Injectable()
export class Keyobject {

transform(value, args:string[]):any {
let keys = [];
for (let key in value) {
keys.push({key: key, value: value[key]});
}
return keys;
}}

Код на шаблона

 <div *ngFor="let o of obj | keyobject">{{o.value}}{{o.key}}</div>

В моя Javascript, ако правя промени в обекта Json, динамичните промени не се отразяват върху шаблона.

obj.TimSays = "Искам да спя";

В шаблона все още казвам, че мога да ходя. Какво трябва да направя тук, в случай че шаблонът и ngFOr (Object) работят като двупосочно обвързване.

Отговори:

3 за отговор № 1

В ъгловите тръби са чист по подразбиране това означава, че те се изпълняват само ако има чиста промяна в неговия вход.

Ако искате вашата тръба да работи във всеки цикъл на откриване на промените, трябва да я направите нечист като този:

@Pipe({
name: "keyobject",
pure: false
})

Но имайте предвид, че това може да окаже значително влияние върху ефективността ви.

По-добре е да извършите "чиста" промяна на входа, като създадете нова справка при модифициране на обекта, например чрез използване Object.assign:

obj = Object.assign({}, obj, { TimSays: "i want to sleep" });

Можете да намерите повече подробности за това нечист/чист тръби в документи.

---

0 за отговор № 2

Просто решение е

<div *ngFor="let o of obj | keyobject:counter">{{o.value}}{{o.key}}</div>

и след това увеличение counter след модификация. Това избягва създаването на нов обект за всяка модификация.

Това работи, тъй като ъгловият извиква тръбата всеки път, когато се променя стойността на въвеждане (обектната референция за обекти) или един от параметрите, предавани на тръбата.

Тя може да стане тромава, макар че обектът се модифицира на друго място в молбата ви.

---