0

I am new to Angular and using primeng for display of data fields. When i click the hyperlink I want the data of the hyperlink to be displayed. below is the code

     <ng-template pTemplate="body" let-file let-i="absRowIndex">
            <tr>
              <td><a routerLink='/getfiledata'>{{file.fID}}</a></td>
              <td><a routerLink='/getfiledata' queryParams="{fID:{file.fID}">{{file.fName}}</a></td>
              <td>{{file.fType}}</td>
              <td>{{file.fUuser}}</td>
              <td>{{file.fUploadDT}}</td>
              <td>{{file.fStatus}}</td>
            </tr>
          </ng-template>

in component file i have added the below code

import { Component, OnInit, OnDestroy } from '@angular/core';
import { ActivatedRoute } from '@angular/router';

@Component({
 selector: 'app-fetch-data',
 templateUrl: './fetch-data.component.html',
 styleUrls: ['./fetch-data.component.css']
})
export class FetchDataComponent implements OnInit, OnDestroy {

private fid ;
private ftype: string ;
private sub: any;

constructor(private route: ActivatedRoute) { }

ngOnInit() {

this.sub = this.route
  .queryParams
  .subscribe(params => {
    console.log(params);
  this.fid = params['fID']; // (+) converts string 'id' to a number
});
}

ngOnDestroy() {
  this.sub.unsubscribe();
}
}

But the parameter received as 

{0: "[", 1: "f", 2: "I", 3: "D", 4: ":", 5: "2", 6: "8", 7: "]"}

I want to be received as

{fID:28 }

to use it further.

Advance thanks for your help.

Suresh G
  • 1
  • 1
  • The object you are passing is not in correct format. Pass querry parameter like this : [queryParams]="{ fID: file.fID}" . – DirtyMind Sep 14 '18 at 18:04

1 Answers1

0

I replicated your issue. You just need to pass your query params with square brackets like below and it will work:

<a routerLink='/getfiledata' [queryParams]="{fID:file.fID">{{file.fName}}</a>
DirtyMind
  • 2,353
  • 2
  • 22
  • 43