Angular 2: Change Detection of array inside the object

Question

I have an object as follows which comes through @Input.

@Input() data;
//**
{
  "class_a":["John","Harr y"],
  "class_b":["Joseph","Phlip","David"],
  "class_c":[]
}  
**//

I need to detect the changes if data added or removed in class_a or class_b but im only getting change detection if values of objects are string. Since the keys in my object are dynamic i couldn't iterate the object and create Iterable differs. Is there anyway to detect changes of array inside the object.

My Implementation:

constructor(private differs: KeyValueDiffers) {
      this.keyValueDiffer = differs.find({}).create();
}

ngDoCheck() {
    let changes = this.keyValueDiffer.diff(this.data[this.component.factedBindKey]);
    if (changes) {
        console.log('Changes detected');
    }
}

https://stackoverflow.com/questions/42108217/how-to-use-trackby-with-ngfor — Никита Середа, Jul 13 '21 at 05:45
I didn't bind the data in html, I just needed to pass data in to other function. So i couldn't use ngFor and trackBy. — Tom, Jul 13 '21 at 05:55
ok, when reinit array after do some changes that will fire changeDetection. Examples: [...YOUR_ARRAY] OR Array.from(YOUR_ARRAY) (same possible for objects) — Никита Середа, Jul 13 '21 at 06:30

score 0 · Answer 1 · answered Jul 13 '21 at 06:43

0

you can test like this

constructor(private cd: ChangeDetectorRef) {
}
  
ngOnChanges() {
    let actualData =this.data
    this.mymethod(actualData);
}

and call this line where you want to access that actual data like this

mymethod(data){
this.cd.detach();
//write main logic 
}

answered Jul 13 '21 at 06:43

Zubair Saif

1,106
1
14
29

If i add this.cd.detach() , then it completely stops detecting any changes . – Tom Jul 13 '21 at 07:21
try it any other method – Zubair Saif Jul 13 '21 at 09:04

Angular 2: Change Detection of array inside the object

1 Answers1