开始

---

立即下载Kendo UI for Angular

本指南提供了开始使用Kendo UI for Angular buttons所需的信息——它包括可用的安装方法、所需的依赖项、运行项目的代码，以及指向其他资源的链接。

Buttons包是Kendo UI for Angular的一部分，这是一个专业级的UI库，包含?100多个?组件，用于构建现代且功能丰富的?应用程序。

完成本指南后，您将能够获得如下示例所示的最终结果。

查看源代码：

设置Angular项目

在开始安装任何Kendo UI for Angular控件之前，请确保你有一个正在运行的Angular项目。不管你想要使用哪个Kendo UI for Angular包，完成组件安装的先决条件都是一样的，在安装Angular项目的章节中有详细描述。

安装组件

你可以选择使用以下两种方式来安装Kendo UI for Angular包和你想要应用的样式：

用Angular CLI快速设置

快速设置提供了一种通过ng-add命令在中自动添加包的方法,它适合于节省时间和精力，因为可以在一个步骤中执行一组单独需要的命令。

要添加Kendo UI for Angular Buttons包，运行以下命令：

ng add @progress/kendo-angular-buttons

因此，ng-add命令将执行如下操作：

• 将@progress/kendo-angular-buttons包作为一个依赖项添加到packagjson文件中。
• 在当前应用模块中导入ButtonsModule。
• 在angular.json文件中注册Kendo UI Default theme。
• 将所有需要的 peer dependencies添加到packag .json文件中。
• 触发npm install来安装主题和所有被添加的同级包。
  

手工设置

手动设置提供了更大的可见性和对Angular应用中安装的文件和引用的更好控制。您可以通过为每个步骤运行单独的命令来安装所需的对等依赖项和KendoUI主题，并在或特性模块中导入所需的组件模块。

1.运行以下命令安装Buttons包及其依赖项：

2.如果应用程序中需要所有按钮组件，请使用ButtonsModule一次性导入所有按钮，否则只能通过添加单独的模块来导入特定的组件。

Buttons包为其组件导出以下单个模块：

• 要添加所有的Buttons组件，请在根应用程序或特性模块中导入ButtonsModule。

• 要添加单独的Buttons组件，只需导入根应用程序或特性模块中需要的模块。

3.下一步是通过安装一个可用的Kendo UI主题-,或来样式化组件。

3.1使用主题之前，先通过NPM安装它的包。

• 默认主题

npm install --save @progress/kendo-theme-default

• 引导主题

npm install --save @progress/kendo-theme-bootstrap

• 材料主题

npm install --save @progress/kendo-theme-material

3.2主题包安装完成后，在工程中引用，您可以通过以下方式之一在项目中包含KendoU I主题：

• 通过使用。
• 通过使用。
• 通过从编译主题。

使用组件

成功安装Buttons包并导入所需模块后，在app.component.html中添加所需组件的相应标签。例如，如果需要Button组件，则添加以下代码：

<button kendoButton>My Button</button>

通过在根文件夹中运行以下命令来构建并提供应用程序。

ng serve

将浏览器指向//localhost:4200，查看页面上的Kendo UI for Angular Button组件。

激活许可证密钥

截至2020年12月，使用任何来自Kendo UI for Angular库的UI组件都需要一个商业许可密钥或一个有效的试用许可密钥，如果您的应用程序不包含Kendo UI许可文件，请激活许可密钥。

依赖关系

下表列出了每个包中每个Buttons依赖项提供的特定功能：