<wj-flex-grid [itemsSource]="data"> 
  <wj-flex-grid-column [header]="'Country'" [binding]="'country'" [width]="'*'"></wj-flex-grid-column> 
  <wj-flex-grid-column [header]="'Date'" [binding]="'date'"></wj-flex-grid-column> 
  <wj-flex-grid-column [header]="'Revenue'" [binding]="'amount'" [format]="'n0'"></wj-flex-grid-column> 
  <wj-flex-grid-column [header]="'Active'" [binding]="'active'"></wj-flex-grid-column> 
 </wj-flex-grid>

 <ag-grid-ng2 #agGrid style="width: 100%; height: 350px;" 
 // items bound to properties on the controller
 [gridOptions]="gridOptions"
 [columnDefs]="columnDefs">
</ag-grid-ng2> 

<wj-flex-grid [itemsSource]="data1"
 [allowSorting]="false"
 [deferResizing]="true">
 <template wjFlexGridCellTemplate [cellType]="'TopLeft'" *ngIf="customTopLeft">
   №
 </template>
 <template wjFlexGridCellTemplate [cellType]="'RowHeader'" *ngIf="customRowHeader" #cell="cell">
   { {cell.row.index}}
 </template>
 <wj-flex-grid-column header="Country"
  binding="country"
  width="*">
  <template wjFlexGridCellTemplate [cellType]="'Cell'" *ngIf="customCell" #item="item">
    <img src="/UploadFiles/2021-04-02/{ {item.country}}.png">

我们声明的单元格模板得到的结果 



 Angular2中可复用的单元格模板 


再次强调，为了在其他表格控件中实现这种效果，你需要编辑JavaScript文件，并ViewModel中编写。
使用数据绑定自动更新控件。 


我相信Angular最具生产力的好处是绑定表达式，这允许我们创建的控件可以自动地响应数据更改，使我们从繁琐的事件处理程序和DOM操作中解放出来。 


FlexGrid所有的属性都支持数据绑定，另外，我们还为一些需要双向数据绑定的属性提供双向绑定。不需要编写任何代码，您就可以绑定组件以处理事件和与Model交互数据。 


数据绑定在任何的开发平台（Java，.NET）都是一等公民，Angular使它变得更加容易，并且同时支持单向和双向数据绑定。 


TypeScript：与Angular 2天作之合。 


FlexGrid和所有的Wijmo控件都使用TypeScript编写。我们在Microsoft平台工作有相当长的一段历史了，所以当TypeScript变得成熟时，我们有一种家的感觉。TypeScript给了我们一种类似于编写C# 的体验：类，继承，强类型，类型检查，构建时错误检查等等。它是我们创建企业级JavaScript控件的催化剂，就像我们在其它平台所做的，我们无需在API或语法中做任何的妥协。 


也许最重要的而是，TypeScript 为我们提供了创建真正的控件而不是小部件的能力。FlexGrid作为一个类继承自我们的基本控件类。当小部件强迫你使用令人尴尬的函数去设置一个属性和传值时，FlexGrid却有getter 和setter 访问器，你可以直接设置他们。Wijmo也包含一个用于简单添加处理程序的事件模型。 


如果我们的用户选择使用TpyeScript来开发时，将会在支持的IDE中获得智能提示、警告，当他们尝试分配为一个属性分配不正确的类型时有错误信息。 


TypeScript最吸引人的特点就是我们的客户可以继承并扩展我们的控件，这符合我们的Flex理念，简化了控件自定制并减少错误。 


最后，我们与Angular2齐头并进。很惊喜地看到几年前我们做出的一个决定，采用了微软的语言。我们的控件类已经采用TypeScript，因此可以和Angular2无缝结合。我们简单地扩展了它们并添加了元数据用来在Angular2组件中暴露它们。 


不要听信我的一面之词：您也试试 


“我们购买了Wijmo，他们的团队做了一个伟大的工作：界面美观；深思熟虑的架构；完善的文档；跟进不断变化的技术。”思科公司的BJ Jeong说。 


如果我的文字没有说服你，鼓励你去尝试FlexGrid，证明我的对错。如果我错了并且FlexGrid被别的Grid控件打败，你可以告诉我。20年来我们从没有停止发展和提高，我们永远也不会停止。立即下载进行体验。


以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。