22-es2015.bffe9f46908e585b37d9.js

(window.webpackJsonp=window.webpackJsonp||[]).push([[22],{bQGT:function(e,n,t){"use strict";t.r(n),t.d(n,"SampleThirdModule",function(){return G});var c=t("An66"),o=t("1VvW"),l=t("5Q2+"),i=t("zMYQ"),a=t("umqh"),s=t("kZht"),r=t("mcff"),d=t("aJOL"),b=t("hCLc"),u=t("1ZKX"),h=t("BL99"),g=t("ctyY"),m=t("j5U8"),p=t("UDV5");function f(e,n){if(1&e&&(s.Vb(0,"span"),s.Gc(1),s.Ub()),2&e){s.hc();const e=s.wc(15);s.Cb(1),s.Jc(" (",null==e.source?null:e.source.length,"x",null==e.displayedColumns?null:e.displayedColumns.length,")")}}function k(e,n){if(1&e){const e=s.Xb();s.Gc(0,"\n            "),s.Vb(1,"mat-checkbox",10),s.dc("change",function(){s.xc(e);const n=s.hc();return s.wc(15).selection.toggleAll(n.data)}),s.Ub(),s.Gc(2,"\n        ")}if(2&e){s.hc();const e=s.wc(15);s.Cb(1),s.oc("indeterminate",e.selectionModel.isIndeterminate)("checked",e.selectionModel.isAll)}}function x(e,n){if(1&e){const e=s.Xb();s.Gc(0,"\n            "),s.Vb(1,"mat-checkbox",11),s.dc("change",function(){s.xc(e);const t=n.$implicit;return s.hc(),s.wc(15).selection.toggle(t)}),s.Ub(),s.Gc(2,"\n        ")}if(2&e){const e=n.$implicit;s.hc();const t=s.wc(15);s.Cb(1),s.oc("checked",t.selectionModel.get(e.id))}}function w(e,n){1&e&&s.Qb(0,"ngx-column",12),2&e&&s.oc("key",n.$implicit)}let y=(()=>{class e{constructor(e,n){this.dialog=e,this.cd=n,this.data=[]}ngOnInit(){i.a.generator(1e3,59).then(e=>{this.data=e,this.cd.detectChanges()})}disableFn(e){return(null==e?void 0:e.id)%5==0}ngAfterViewInit(){document.querySelectorAll("pre code").forEach(e=>{hljs.highlightBlock(e)})}showSample(){this.dialog.open(a.a,{data:{title:"Overview selection table",description:"In order to use the API for string highlighting, you can use the table.selection service. <br>In more detail you can read in the guide.",code:'\n<ngx-table-builder #table [source]="data" enable-selection>\n    <ngx-column key="selection" sticky width="55" custom-key>\n        <ng-template ngx-th>\n            <mat-checkbox\n                (change)="table.selection.toggleAll(data)"\n                [indeterminate]="table.selectionModel.isIndeterminate"\n                [checked]="table.selectionModel.isAll"\n            ></mat-checkbox>\n        </ng-template>\n        <ng-template ngx-td row let-row (onClick)="$event.preventDefault()">\n            <mat-checkbox\n                [checked]="table.selectionModel.get($any(row).id)"\n                (change)="table.selection.toggle(row)"\n            ></mat-checkbox>\n        </ng-template>\n    </ngx-column>\n\n    <ngx-column *ngFor="let key of table.modelColumnKeys" [key]="key">\n       \x3c!--\n        If you want to parameterize your templates, you can describe the code here.\n        <ng-template ngx-th>{{ key }}</ng-template>\n        <ng-template ngx-td let-cell>{{ cell }}</ng-template>\n       --\x3e\n    </ngx-column>\n</ngx-table-builder>\n                    '},height:"650px",width:"900px"})}}return e.\u0275fac=function(n){return new(n||e)(s.Ob(r.b),s.Ob(s.h))},e.\u0275cmp=s.Ib({type:e,selectors:[["sample-third"]],decls:27,vars:5,consts:[[1,"simple-toolbar"],[4,"ngIf"],[2,"margin-left","5px"],["mat-raised-button","",1,"show-simple",3,"click"],["enable-selection","",3,"source","produce-disable-fn"],["table",""],["key","selection","sticky","","width","55","custom-key",""],["ngx-th",""],["ngx-td","","row","",3,"onClick"],[3,"key",4,"ngFor","ngForOf"],[3,"indeterminate","checked","change"],[3,"checked","change"],[3,"key"]],template:function(e,n){if(1&e&&(s.Vb(0,"mat-toolbar",0),s.Gc(1,"\n    "),s.Vb(2,"span"),s.Gc(3,"\n        Example selection\n        "),s.Ec(4,f,2,2,"span",1),s.Gc(5,"\n        "),s.Vb(6,"span",2),s.Gc(7),s.Ub(),s.Gc(8,"\n    "),s.Ub(),s.Gc(9,"\n    "),s.Vb(10,"button",3),s.dc("click",function(){return n.showSample()}),s.Gc(11,"show code sample"),s.Ub(),s.Gc(12,"\n"),s.Ub(),s.Gc(13,"\n\n"),s.Vb(14,"ngx-table-builder",4,5),s.Gc(16,"\n    "),s.Vb(17,"ngx-column",6),s.Gc(18,"\n        "),s.Ec(19,k,3,2,"ng-template",7),s.Gc(20,"\n        "),s.Ec(21,x,3,1,"ng-template",8),s.dc("onClick",function(e){return e.preventDefault()}),s.Gc(22,"\n    "),s.Ub(),s.Gc(23,"\n\n    "),s.Ec(24,w,1,1,"ngx-column",9),s.Gc(25,"\n"),s.Ub(),s.Gc(26,"\n")),2&e){const e=s.wc(15);s.Cb(4),s.oc("ngIf",e.isRendered),s.Cb(3),s.Ic("Selected: ",e.selection.selectionModel.size,""),s.Cb(7),s.oc("source",n.data)("produce-disable-fn",n.disableFn),s.Cb(10),s.oc("ngForOf",e.modelColumnKeys)}},directives:[d.a,c.m,b.a,u.a,h.a,g.a,m.a,c.l,p.a],encapsulation:2,changeDetection:0}),e})(),G=(()=>{class e{}return e.\u0275fac=function(n){return new(n||e)},e.\u0275mod=s.Mb({type:e}),e.\u0275inj=s.Lb({imports:[[c.b,l.a,o.b.forChild([{path:"",component:y}])]]}),e})()}}]);