UI组件库Kendo UI for Angular入门指南教程： Button（按钮） – 入门指南

安装

使用快速设置 (Angular CLI) 或手动添加包。

使用 Angular CLI 进行快速设置

Angular CLI 支持通过 ng add 命令添加包，该命令一步执行一组其他单独需要的命令。

ng add @progress/kendo-angular-buttons

手动设置

您在安装过程中引用的所有组件都将出现在应用程序的最终包中。

为避免最终使用您实际上不需要的组件，请执行以下任一操作：

• 使用 ButtonsModule 一次性导入所有 Buttons 组件
• 通过将特定的 Buttons 组件添加为单独的 NgModule 来导入它。

1. 下载并安装软件包。

npm install –save @progress/kendo-angular-buttons @progress/kendo-angular-l10n @progress/kendo-angular-popup @progress/kendo-angular-common @progress/kendo-licensing

2. 安装后，导入所需组件的 NgModule。

要获取所有包组件，请在应用程序根或功能模块中导入 ButtonsModule。

import { NgModule } from '@angular/core';import { BrowserModule } from '@angular/platform-browser';import { BrowserAnimationsModule } from '@angular/platform-browser/animations';import { ButtonsModule } from '@progress/kendo-angular-buttons';import { AppComponent } from './app.component';@NgModule({bootstrap: [AppComponent],declarations: [AppComponent],imports: [BrowserModule, BrowserAnimationsModule, ButtonsModule]})export class AppModule {}

该包还为各个组件导出以下模块：

• ButtonModule
• ButtonGroupModule
• ChipModule
• DropDownButtonModule
• FloatingActionButtonModule
• SplitButtonModule

要减小应用程序的大小，请仅包含您需要的模块。

import { NgModule } from '@angular/core';import { BrowserModule } from '@angular/platform-browser';import { BrowserAnimationsModule } from '@angular/platform-browser/animations';import { AppComponent } from './app.component';// Imports the Button moduleimport { ButtonModule } from '@progress/kendo-angular-buttons';// Imports the ButtonGroup moduleimport { ButtonGroupModule } from '@progress/kendo-angular-buttons';@NgModule({bootstrap: [AppComponent],declarations: [AppComponent],imports: [BrowserModule, BrowserAnimationsModule,ButtonModule, ButtonGroupModule]})export class AppModule {}

3. 您需要为Angular安装Kendo UI主题来设置组件样式。

4. 按照 Kendo UI for Angular My License 页面上的说明激活您的许可证，如果您的应用程序已包含 Kendo UI 许可文件，则可以跳过此步骤。

依赖关系

Buttons 包要求您在应用程序中安装以下对等依赖项：

• @angular/common
• @angular/core
• @progress/kendo-angular-l10n
• @progress/kendo-angular-popup
• @progress/kendo-angular-common
• @progress/kendo-licensing
• rxjs

Buttons包利用了Angular动画系统，它支持一组特定的浏览器。

Kendo UI for Angular | 下载试用

Kendo UI for Angular是Kendo UI系列商业产品的最新产品。Kendo UI for Angular是专用于Angular开发的专业级Angular组件。telerik致力于提供纯粹的高性能Angular UI组件，无需任何jQuery依赖关系。