कोणीय 2 - * ngFor कुंजी के साथ रीफ्रेश नहीं किया जाता है जब ऑब्जेक्ट बदल जाता है

Question

मैं * ngfor लूप में कुंजी पाइप का उपयोग कर रहा हूं। जेएसओएन में डेटा खिलाया जाता है।

@Pipe({ 
     name: 'keys' 
    }) 
    export class KeysPipe implements PipeTransform { 
     transform(value, args: string[]): any { 
     if (!value) { 
      return value; 
     } 

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

- जब मैं JSON में तत्व की पर हटाना

<div *ngFor="let item of jsonObject | keys"> 
     <p>{{ item.value.code }}</p> 
</div> 

समस्या है, ngFor अद्यतन नहीं किया गया है।

मैं दो विकल्प पहले से ही की कोशिश की है:

• बुला this.applicationRef.tick(); तत्व के बाद हटाने के लिए, कोई परिवर्तन नहीं
• अशुद्ध पाइप "शुद्ध: झूठी"। इससे सैकड़ों एमबी में क्रोम में भारी स्मृति उपयोग हुआ और मुझे प्रक्रिया को मारना पड़ा।

यदि कोई अन्य तरीका है?

धन्यवाद!

Answer 1

एक दूसरी तरह से तुम कोशिश कर सकते JSONObject को अस्थायी से एक गहरी प्रतिलिपि की कोशिश कर सकते। यही कारण है कि पाइप

के लिए crutial बात है

भी देखें

• NgFor doesn't update data with Pipe in Angular2
• Unraveling Angular 2 book, Chapter 1, Example 5

Answer 2

शुद्ध पाइप तब तक नहीं चलते जब तक संदर्भ या मान परिवर्तित नहीं होता है। इसे ठीक करने के लिए अपने पाइप सजावट में pure: false जोड़ें। Pipes

पूर्व देखें।

@Pipe({ 
    name: 'keyVal', 
    pure: false 
}) 
export class KeyValPipe implements PipeTransform { 
    ... 
} 

संपादित मैं देख रहा हूँ था कि ओपी पहले से ही इस किया था। एक और विकल्प एक अस्थायी चर सेट करना है और उसके बाद jsonObject असाइन करना इस प्रकार एक नया संदर्भ बनाना है।

delete(id) { 
    this.jsonObject = this.jsonObject.filter(x => x.id !== id); 
} 

इस तरह से आप मूल सरणी उत्परिवर्तित नहीं होगा: आप भी