<kendo-grid  [data]="data" (cellClick)="onCellClick($event)">
  <ng-template kendoGridToolbarTemplate>
    {{this.AgencyName}}
  </ng-template>

  <kendo-grid-column field="LNEOM" title="Period" format='{0:yyyy MMMM}' width="150"> </kendo-grid-column>
  <kendo-grid-column field="LoanNumber" width="250"> </kendo-grid-column>
  <kendo-grid-column field="Borrower" width="150"> </kendo-grid-column>
  <kendo-grid-column field="SETLDX"  width="150" title="Settlement Date" format='{0:MM/dd/yyyy}'> </kendo-grid-column>
  <kendo-grid-column field="LoanAmount"  width="150" format='{0:c}' > </kendo-grid-column>
  <kendo-grid-column field="Balance"  width="150" format='{0:c}' > </kendo-grid-column>
  <kendo-grid-column field="IncomeAmount"  width="150"  format='{0:c}' > </kendo-grid-column>
  <kendo-grid-column field="matchedPayIn" title="Matched"  width="200" format='{0:c}'>
    <ng-template kendoGridCellTemplate let-dataItem>
      <kendo-icon *ngIf="dataItem.matchedPayIn === -1" [name]="'close-circle'" [size]="'small'" [themeColor]="'warning'"></kendo-icon>
      <kendo-icon *ngIf="dataItem.matchedPayIn !== -1" [name]="'tick'" [size]="'small'" [themeColor]="'success'"></kendo-icon>
      {{ dataItem.matchedPayIn === -1? 'Not matched': dataItem.matchedPayIn.Id}}
    </ng-template>
  </kendo-grid-column>
  <kendo-grid-column field="TRSTCD" width="150" > </kendo-grid-column>
  <kendo-grid-column field="ORGNTR" width="150" > </kendo-grid-column>
  <kendo-grid-column field="LOANNO" width="150" > </kendo-grid-column>
  <kendo-grid-column field="PORTN" width="150" > </kendo-grid-column>
  <kendo-grid-column field="BRNAMX" width="150" > </kendo-grid-column>
  <kendo-grid-column field="LNAMT"  width="150" format='{0:c}' > </kendo-grid-column>
  <kendo-grid-column field="INTRTE"  width="150"  > </kendo-grid-column>
  <kendo-grid-column field="DELRTE"  width="150" > </kendo-grid-column>
  <kendo-grid-column field="SETLDX"  width="150" format='{0:MM/dd/yyyy}'> </kendo-grid-column>
  <kendo-grid-column field="LNBAL"  width="150" format='{0:c}' > </kendo-grid-column>
  <kendo-grid-column field="MANFEE"  width="150" format='{0:c}' > </kendo-grid-column>
  <kendo-grid-column field="RSINCP"  width="150" format='{0:p}' > </kendo-grid-column>
  <kendo-grid-column field="RSSACT" width="150" > </kendo-grid-column>
  <kendo-grid-column field="RSSACP"  width="150" format='{0:p}' > </kendo-grid-column>
  <kendo-grid-column field="SACAMT"  width="150" format='{0:c}' > </kendo-grid-column>
  <kendo-grid-column field="MOFEE"  width="150" format='{0:c}' > </kendo-grid-column>
  <kendo-grid-column field="MANTOT"  width="150" format='{0:c}' > </kendo-grid-column>
  <kendo-grid-column field="NEWLON"  width="150" format='{0:c}' > </kendo-grid-column>
  <kendo-grid-column field="REFADJ"  width="150" format='{0:c}' > </kendo-grid-column>
  <kendo-grid-column field="NETNEW"  width="150" format='{0:c}' > </kendo-grid-column>
  <kendo-grid-column field="FIXED"  > </kendo-grid-column>
  <kendo-grid-column field="LNFORT"  width="150"  > </kendo-grid-column>
  <kendo-grid-column field="ORGNAM"   width="150" > </kendo-grid-column>
  <kendo-grid-column field="LNEOM"  width="150" format='{0:yyyy MMMM}'> </kendo-grid-column>


</kendo-grid>
