Pipe prevents DataTable from updating.

UI Components for Angular
Post Reply
Posts: 6
Joined: 06 Jun 2016, 20:28

08 Jun 2016, 18:06

I created my own custom pipe to simply do search on my datatable and it works fine as :

Code: Select all

      <p-dataTable [value]="clients | clientSearchPipe">
                        <p-column field="fullName" header="Full Name"></p-column>
I have now added a crud operation to add new clients to the list, however the change is NOT being reflected on the datatable once I press "add".
My service pushes a new client onto the "clients" array.

I can see the change is reflected fine on another portion of the site.

<ul><li *ngFor="#client of clients">{{client.fullName}}</li></ul>

When I add new client, a new entry is added to the <ul>, but not to the datatable.
The data is there, as I type something in my 'search', the new values will be shown in the datatable as well, however still not when I press the "add".

Perhaps my service is not doing something right, as I do not use http.get but rather simple hard coded json.

In AppComponent:

Code: Select all

export class ClientsComponent implements OnInit {

    @Input() searchInput;

    clients: Client[];

    constructor(private clientService: ClientService) { }

    ngOnInit() {
        this.clients = this.clientService.getClients();

    addNewClient(firstName, lastName) {
        let client = new Client(firstName, lastName);


In service

Code: Select all

export class ClientService {

    clients: Client[] = [];

    constructor() { }

    addNewClient(client) {

    getClients() {

            new Client("Timur", "Rzumbaev"),
            new Client("Uriy", "Gagarin"),
            new Client("Vladimir", "Putin"),
            new Client("Justin", "Trudeau"),
            new Client("Donald", "Trump"),
            new Client("Pepites", "DePoules")


        return this.clients;

Post Reply

Return to “PrimeNG”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 5 guests