i want implement angular directive make table header sortable. have tried following:
html:
<th sortable="headers[0]"> company id </th> <th sortable="headers[1]"> client id </th>
typescript controller:
... $scope.headers = [ new models.campaigntableheader("companyid", true, "agency"), new models.campaigntableheader("clientid", true, "client"), new models.campaigntableheader("clientname", true, "client name"), new models.campaigntableheader("name", true, "campaign name") ]; ...
typescript tableheader model:
export class campaigntableheader { public asce: boolean; public desc: boolean; public css: () => string; constructor( public id: string, public sortable: boolean = false, public title?: string ) { if (_.isnull(title) || _.isundefined(title)) { this.title = id; } this.asce = false; this.desc = false; this.css = () => { var result = this.sortable ? "sortable" : ""; if (this.asce) { result = "sortable-asce " + result; } else if (this.desc) { result = "sortable-desc " + result; } return result; } } }
typescript main:
var cuidapp = angular .module("mainmodule", []) .controller("maincontroller", ["$scope", "$http", "$window", "$timeout", "$q", controllers.maincontroller]) .directive("sortable", () => { return { link: (scope: any, element, attrs) => { var value: models.campaigntableheader = scope.sortable; console.log(scope.sortable); var e = $(element); e.attr("ng-class", "sortable.css()"); }, scope: { sortable: "=" } } });
console.log(scope.sortable)
outputs expected campaigntableheader object. problem ng-class
directive doesn't have right scope. check console scope header element , doesn't have sortable
property. know should change work?
Comments
Post a Comment