daniel-nagy / md-data-table

Material Design Data Table for Angular Material
MIT License
1.9k stars 519 forks source link

Pass .bind($ctrl) to md-on-reorder causes invinite digest #616

Open scipper opened 7 years ago

scipper commented 7 years ago

I have the the following reorder function in my controller class (ES2015):

class MyController {
    constructor() {
        this.newOrder = 'name';
    }

    onReorder(order) {
        this.newOrder = order;
    }
}

And I referenced the onReorder function like this:

`

` Without .bind($ctrl) the context is obviously undefined. But passing .bind($ctrl) I receive the error: **vendor.js:56763 Error: [$rootScope:infdig] 10 $digest() iterations reached. Aborting!** How can I properly pass the context of my controller to the onReorder function? The answer from @daniel-nagy in [changed how the onPaginate callback fn is bound](https://github.com/daniel-nagy/md-data-table/pull/400) seems kinda bad practice to me.
daniel-nagy commented 7 years ago

Don't use bind in your template, use it in your constructor.

class MyController {
    constructor() {
        this.newOrder = 'name';
        this.onReorder = this.onReorder.bind(this);
    }

    onReorder(order) {
        this.newOrder = order;
    }
}

I think using bind is forbidden in angular expressions becuase it creates a new function,

You can't declare functions or create regular expressions from within AngularJS expressions.

Also binding the method in the constructor will be more efficient.

scipper commented 7 years ago

This approach looks a bit better to me.

I did not know that .bind() returns a new function. Using thing technic on filters like

| filter: $ctrl.filterFunc.bind($ctrl)

works.