📌  相关文章
📜  角材料-环境设置

📅  最后修改于: 2020-10-28 04:56:37             🧑  作者: Mango

如何使用角材料？

有两种使用Angular Material的方法-

  • 本地安装-您可以在本地计算机上使用npm，jspm或bower下载Angular Material库，并将其包含在HTML代码中。

  • 基于CDN的版本-您可以直接从内容交付网络（CDN）将angular-material.min.css和angular-material js文件包含到HTML代码中。

本地安装

在使用以下npm命令之前，我们需要在系统上安装NodeJS。要获取有关节点JS的信息，请单击此处并打开NodeJS命令行界面。我们将使用以下命令来安装Angular Material库。

npm install angular-material

上面的命令将生成以下输出-

angular-animate@1.5.2 node_modules\angular-animate

angular-aria@1.5.2 node_modules\angular-aria

angular-messages@1.5.2 node_modules\angular-messages

angular@1.5.2 node_modules\angular

angular-material@1.0.6 node_modules\angular-material

npm将在node_modules> angular-material文件夹下下载文件。按照以下示例中的说明包含文件-

例

现在，您可以在HTML文件中包含css和js文件，如下所示-

现场演示

      
      
      
      
      
      
      
   
   
   
      
         

            
HTML 5

         

      
      
      
         
HTML5 is the next major revision of the HTML standard superseding HTML
         4.01, XHTML 1.0, and XHTML 1.1. HTML5 is a standard for structuring and
         presenting content on the World Wide Web.

         
         
HTML5 is a cooperation between the World Wide Web Consortium (W3C) and
         the Web Hypertext Application Technology Working Group (WHATWG).

         
         
The new standard incorporates features like video playback and drag-and-drop
         that have been previously dependent on third-party browser plug-ins such as
         Adobe Flash, Microsoft Silverlight, and Google Gears.

上面的程序将产生以下结果-

基于CDN的版本

您可以直接从Content Delivery Network（CDN）将angular-material.css和angular-material.js文件包含到HTML代码中。 Google CDN提供最新版本的内容。

在本教程中，我们一直使用该库的Google CDN版本。

例

现在，让我们使用Google CDN中的angular-material.min.css和angular-material.min.js重写以上示例。

现场演示

      
      
      
      
      

      
   
   
   
      
         

            
HTML 5

         

      
      
      
         
HTML5 is the next major revision of the HTML standard superseding HTML 4.01,
         XHTML 1.0, and XHTML 1.1. HTML5 is a standard for structuring and presenting 
         content on the World Wide Web.


         
HTML5 is a cooperation between the World Wide Web Consortium (W3C) and the Web
         ypertext Application Technology Working Group (WHATWG).

         
         
The new standard incorporates features like video playback and drag-and-drop
         that have been previously dependent on third-party browser plug-ins such as Adobe
         Flash, Microsoft Silverlight, and Google Gears.

上面的程序将产生以下结果-