Child Component is not updating when data inside object is changed

Question

I have AppComponent on which I have defined routing. In that, I have a setting like Home/Scan/:name where I have multiple names which call different GET service which accepts name as a parameter.

I have defined [routerLink]="['Scanning',r.name]" as a link. My child component is not getting refreshed with new data. Please tell what I am doing wrong.

const routes: Routes = [
{ path: 'Home', component: ReportComponent,children:[
{ path: 'Scanning', component: ScanningOutputComponent},
{ path: 'Scanning/:name',component: ScanningOutputComponent }
 ]},
{ path: '',redirectTo:'Home', pathMatch:'full' },
{ path: '**',redirectTo:'Home', pathMatch:'full' }
];

Updated code.

Receiving Params from ReportComponent for below code.

  this.aRoute.params.subscribe(params => this.sub = params['name']);
switch (this.sub) {
  case 'All':
    this.http.get('http://192.168.117.107:8080/rest/ScanningOutput/all')
      .subscribe(data => {
        this.scanningdata = data;
        //console.log(data);
      });
    break;
  case 'POD':
    this.http.get('http://192.168.117.107:8080/rest/ScanningOutput/ByDevice/POD')
      .subscribe(data => {
        this.scanningdata = data;
        //console.log(data);
      });
    break;
  case 'PUP':
    this.http.get('http://192.168.117.107:8080/rest/ScanningOutput/ByDevice/PUP')
      .subscribe(data => {
        this.scanningdata = data;
        //console.log(data);
      });
    break;
  case 'REX':
    this.http.get('http://192.168.117.107:8080/rest/ScanningOutput/ByDevice/REX')
      .subscribe(data => {
        this.scanningdata = data;
        //console.log(data);
      });
    break;
  default:
    console.log("invalid");
    break;
}

Routing works when I call routerLink at first, but when I pass other values and get data from GET API my view does not get refreshed with new data — Sanket Thotange, Jan 12 '18 at 13:39
The switch is outside of this.aRoute.params.subscribe. It will not run on every update of this.sub — Ayala, Jan 12 '18 at 14:08

score 1 · Answer 1 · answered Jan 12 '18 at 09:43

1

You have wrote scanning where you have defined routes,and you are passing scan in routerlink

answered Jan 12 '18 at 09:43

shubham agarwal

157
9

Routing works when I call routerLink at first, but when I pass other values and get data from GET API my view does not get refreshed with new data. – Sanket Thotange Jan 12 '18 at 10:18

score 1 · Answer 2 · answered Jan 12 '18 at 14:14

Try to declare the switch inside the subscribe section:

this.aRoute.params.subscribe(params => { 
        this.sub = params['name'];
        switch (this.sub) {
            case 'All':
                this.http.get('http://192.168.117.107:8080/rest/ScanningOutput/all')
                    .subscribe(data => {
                        this.scanningdata = data;
                        //console.log(data);
                    });
                break;
            ...
            default:
                console.log("invalid");
                break;
        }
    });

Child Component is not updating when data inside object is changed

2 Answers2