15-es2015.2ef27df9f3be704bb38f.js

(window.webpackJsonp=window.webpackJsonp||[]).push([[15],{I68A:function(n,e,t){"use strict";t.r(e),t.d(e,"SampleFourthModule",function(){return v});var c=t("An66"),a=t("1VvW"),l=t("5Q2+"),o=t("kZht"),m=t("aJOL"),i=t("1ZKX"),p=t("BL99"),s=t("ctyY"),u=t("j5U8");function r(n,e){1&n&&o.Gc(0,"Small")}function b(n,e){1&n&&(o.Gc(0),o.ic(1,"currency")),2&n&&o.Hc(o.jc(1,1,e.$implicit))}function d(n,e){1&n&&o.Gc(0,"Medium")}function g(n,e){1&n&&(o.Gc(0),o.ic(1,"currency")),2&n&&o.Hc(o.jc(1,1,e.$implicit))}function G(n,e){1&n&&o.Gc(0,"Large")}function y(n,e){1&n&&(o.Gc(0),o.ic(1,"currency")),2&n&&o.Hc(o.jc(1,1,e.$implicit))}function h(n,e){1&n&&o.Gc(0,"Date")}function x(n,e){1&n&&(o.Gc(0),o.ic(1,"date")),2&n&&o.Ic("\n                    ",o.kc(1,1,e.$implicit,"dd.MM.yyyy HH:mm"),"\n                ")}let f=(()=>{class n{constructor(){this.data=[],this.elements=[]}ngOnInit(){this.data=[{toppings:["tomato sauce","mozzarella cheese"],prices:{small:"5.00",medium:"6.00",large:"7.00"}},{toppings:["tomato sauce","mozzarella cheese","ham"],prices:{small:"6.50",medium:"7.50",large:"8.50"}}],this.elements=[{position:null,name:"Hydrogen",date:{value:NaN},symbol:"H",status:!0},{position:2,name:"",date:{value:new Date},symbol:void 0,status:!1},{position:3,name:"Lithium",date:{value:1/0},symbol:"Li",status:!0},{position:4,name:"Beryllium",date:{value:0},symbol:"    ",status:!1}]}ngAfterViewInit(){document.querySelectorAll("pre code").forEach(n=>{hljs.highlightBlock(n)})}}return n.\u0275fac=function(e){return new(e||n)},n.\u0275cmp=o.Ib({type:n,selectors:[["sample-fourth"]],decls:101,vars:3,consts:[[1,"simple-toolbar"],[1,"column-samples"],[1,"column"],[1,"javascript"],["auto-width","",3,"source"],["key","toppings","width","350"],["key","prices.small"],["ngx-th",""],["ngx-td",""],["key","prices.medium"],["key","prices.large"],["key","date.value","important-template","",3,"stub"]],template:function(n,e){1&n&&(o.Vb(0,"mat-toolbar",0),o.Gc(1,"\n    "),o.Vb(2,"span"),o.Gc(3,"Example nested models"),o.Ub(),o.Gc(4,"\n"),o.Ub(),o.Gc(5,"\n\n"),o.Vb(6,"div",1),o.Gc(7,"\n    "),o.Vb(8,"div",2),o.Gc(9,"\n        "),o.Vb(10,"pre"),o.Vb(11,"code",3),o.Gc(12,"\n  // app.component.ts\n  import { Component } from \"@angular/core\";\n  import { Pizza } from \"./pizza.interface\";\n\n  @Component({\n    selector: 'app',\n    templateUrl: './app.component.html'\n  })\n  export class AppComponent {\n\n    public pizzas: Pizza[] = [\n        {\n            toppings: ['tomato sauce', 'mozzarella cheese'],\n            prices: {\n              small: '5.00',\n              medium: '6.00',\n              large: '7.00'\n            }\n        },\n        {\n            toppings: ['tomato sauce', 'mozzarella cheese', 'ham'],\n            prices: {\n              small: '6.50',\n              medium: '7.50',\n              large: '8.50'\n            }\n        }\n    ];\n\n  }\n\n"),o.Ub(),o.Ub(),o.Gc(13,"\n    "),o.Ub(),o.Gc(14,"\n    "),o.Vb(15,"div",2),o.Gc(16,"\n        "),o.Vb(17,"pre"),o.Vb(18,"code",3),o.Pb(),o.Gc(19,'\n  \x3c!-- app.component.html --\x3e\n\n  <ngx-table-builder [source]="data" auto-width>\n    <ngx-column key="toppings" width="350"></ngx-column>\n\n    <ngx-column key="prices.small">\n      <ng-template ngx-th>Small</ng-template>\n      <ng-template ngx-td let-cell>{{ cell | currency }}</ng-template>\n    </ngx-column>\n\n     <ngx-column key="prices.small">\n      <ng-template ngx-th>Small</ng-template>\n      <ng-template ngx-td let-cell>{{ cell | currency }}</ng-template>\n    </ngx-column>\n\n    <ngx-column key="prices.small">\n      <ng-template ngx-th>Small</ng-template>\n      <ng-template ngx-td let-cell>{{ cell | currency }}</ng-template>\n    </ngx-column>\n  </ngx-table-builder>\n\n'),o.Wb(),o.Ub(),o.Ub(),o.Gc(20,"\n\n        "),o.Vb(21,"ngx-table-builder",4),o.Gc(22,"\n            "),o.Qb(23,"ngx-column",5),o.Gc(24,"\n\n            "),o.Vb(25,"ngx-column",6),o.Gc(26,"\n                "),o.Ec(27,r,1,0,"ng-template",7),o.Gc(28,"\n                "),o.Ec(29,b,2,3,"ng-template",8),o.Gc(30,"\n            "),o.Ub(),o.Gc(31,"\n\n            "),o.Vb(32,"ngx-column",9),o.Gc(33,"\n                "),o.Ec(34,d,1,0,"ng-template",7),o.Gc(35,"\n                "),o.Ec(36,g,2,3,"ng-template",8),o.Gc(37,"\n            "),o.Ub(),o.Gc(38,"\n\n            "),o.Vb(39,"ngx-column",10),o.Gc(40,"\n                "),o.Ec(41,G,1,0,"ng-template",7),o.Gc(42,"\n                "),o.Ec(43,y,2,3,"ng-template",8),o.Gc(44,"\n            "),o.Ub(),o.Gc(45,"\n        "),o.Ub(),o.Gc(46,"\n    "),o.Ub(),o.Gc(47,"\n"),o.Ub(),o.Gc(48,"\n\n"),o.Qb(49,"br"),o.Gc(50,"\n\n"),o.Vb(51,"div",1),o.Gc(52,"\n    "),o.Vb(53,"div",2),o.Gc(54,"\n        "),o.Vb(55,"ngx-table-builder",4),o.Gc(56,"\n            "),o.Vb(57,"ngx-column",11),o.Gc(58,"\n                "),o.Ec(59,h,1,0,"ng-template",7),o.Gc(60,"\n                "),o.Ec(61,x,2,4,"ng-template",8),o.Gc(62,"\n            "),o.Ub(),o.Gc(63,"\n        "),o.Ub(),o.Gc(64,"\n        "),o.Qb(65,"br"),o.Gc(66,"\n\n        "),o.Vb(67,"pre"),o.Vb(68,"code",3),o.Pb(),o.Gc(69,'\n   \x3c!-- app.component.html --\x3e\n\n   <ngx-table-builder [source]="data" auto-width>\n     \x3c!-- important-template - keyword to override table column styles --\x3e\n     <ngx-column key="date.value" important-template [stub]="null">\n        <ng-template ngx-th>Date</ng-template>\n        <ng-template ngx-td let-date>\n          {{ date | date: \'dd.MM.yyyy HH:mm\' }}\n        </ng-template>\n     </ngx-column>\n   </ngx-table-builder>\n\n        '),o.Wb(),o.Ub(),o.Ub(),o.Gc(70,"\n\n        By default we use '--' for stub invalid value. In some cases, you need not to use a stub. For example, if you\n        leave a stub, an error may occur: "),o.Qb(71,"br"),o.Qb(72,"br"),o.Gc(73,"\n        "),o.Vb(74,"pre"),o.Gc(75," InvalidPipeArgument: 'Unable to convert \"-\" into a date' for pipe 'DatePipe'."),o.Ub(),o.Gc(76,"\n    "),o.Ub(),o.Gc(77,"\n    "),o.Vb(78,"div",2),o.Gc(79,"\n        "),o.Vb(80,"pre"),o.Vb(81,"code",3),o.Pb(),o.Gc(82,"\n  // app.component.ts\n  import { Component } from \"@angular/core\";\n  import { Elements } from \"./elements.interface\";\n\n  @Component({\n    selector: 'app',\n    templateUrl: './app.component.html'\n  })\n  export class AppComponent {\n    public data: Elements[] = [\n     { position: null, name: 'Hydrogen', date: { value: NaN }, symbol: 'H', status: true },\n     { position: 2, name: '', date: { value: new Date() }, symbol: undefined, status: false },\n     { position: 3, name: 'Lithium', date: { value: Infinity }, symbol: 'Li', status: true },\n     { position: 4, name: 'Beryllium', date: { value: 0 }, symbol: '    ', status: false }\n    ];\n  }\n\n"),o.Wb(),o.Ub(),o.Ub(),o.Gc(83,"\n\n        "),o.Vb(84,"p"),o.Gc(85,"\n            "),o.Vb(86,"strong"),o.Gc(87,"Note"),o.Ub(),o.Gc(88,": If you want to override the template body of the table, you just use only ng-template\n            with ngx-td. If you use templating, then you need to specify the keys (example with toppings) in the\n            template in the order in which you want to display your columns.\n        "),o.Ub(),o.Gc(89,"\n\n        "),o.Vb(90,"p"),o.Gc(91,"\n            "),o.Vb(92,"strong"),o.Gc(93,"Note"),o.Ub(),o.Gc(94,": By default, if the cell value is invalid, then the default separator is used. You can\n            override or disable it in the module settings.\n        "),o.Ub(),o.Gc(95,"\n    "),o.Ub(),o.Gc(96,"\n"),o.Ub(),o.Gc(97,"\n\n"),o.Qb(98,"br"),o.Qb(99,"br"),o.Gc(100,"\n")),2&n&&(o.Cb(21),o.oc("source",e.data),o.Cb(34),o.oc("source",e.elements),o.Cb(2),o.oc("stub",null))},directives:[m.a,i.a,p.a,s.a,u.a],pipes:[c.c,c.e],encapsulation:2,changeDetection:0}),n})(),v=(()=>{class n{}return n.\u0275fac=function(e){return new(e||n)},n.\u0275mod=o.Mb({type:n}),n.\u0275inj=o.Lb({imports:[[c.b,l.a,a.b.forChild([{path:"",component:f}])]]}),n})()}}]);