Sorting in the SPA

Add the Radio Buttons component from Valor Soft.

Register in app.module.ts

@NgModule({
  imports: [ButtonsModule.forRoot(),...]
})

Open member-list.component.ts and add a default value for the orderBy property.

ngOnInit() {
  this.route.data.subscribe(data => {
    this.users = data['users'].result;
    this.pagination = data['users'].pagination;
  });

  this.userParams.gender = this.user.gender === 'male' ? 'female' : 'male';
  this.userParams.minAge = 18;
  this.userParams.maxAge = 99;
  this.userParams.orderBy = 'lastactive';
}

Add the new parameter in user.service.ts

if (userParams != null) {
  params = params
    .set('minAge', userParams.minAge)
    .set('maxAge', userParams.maxAge)
    .set('gender', userParams.gender)
    .set('orderBy', userParams.orderBy);
}

Test the application.