Ionic2集成DevExtreme

安装Install DevExtreme Angular

npm install --save devextreme devextreme-angular

或者在package.json 文件中增加依赖

"devextreme": "^17.1.5",

"devextreme-angular": "^17.1.5",

 

导入DevExtreme模块，可以单独导入也可以完全导入

 

//Imports a separate module

import { DxButtonModule } from 'devextreme-angular/ui/button';

 

//Imports the entire DevExtreme

import { DevExtremeModule } from 'devextreme-angular';

 

@NgModule({

...

imports: [

...

DevExtremeModule,

...

]

})

 

应用DevExtreme样式

DevExtreme的样式文件目录在 node-modules\devextreme\dist\css

将所需要的样式文件复制到 src/asserts/css目录下

在index.html文件中链接样式文件

<link href="assets/css/dx.common.css" rel="stylesheet">

<link href="assets/css/dx.light.css" rel="stylesheet">

 

使用DevExtreme Component

. . .

<ion-content padding>

<h3>Welcome to your first Ionic app!</h3>

<dx-button text="Hello world"></dx-button>

. . .