angular JS + PrimeNG 初學使用

angular Js 初學習

首先需要下載安裝node js, 如果太老版本可以選擇更新到最新版本。命令;
npm install -g n, 如果有error 使用 npm install -g n –force. 這樣就安裝了n模塊,專門用來管理node js的版本命令。然後使用n 6.11.2加版本號 或者 n stable.
或者直接官網下載最新版OK。https://nodejs.org/en/
- npm install -g @angular/cli —然後全局安裝 Angular CLI
- ng new my-app –新建一個項目
- cd my-app –進入項目路徑
- ng serve –open –監聽sever 運行項目
https://angular.cn/guide/quickstart 這個快速上手Ng的說明,可以很快學習到如何配置安裝使用。


然後就是加入前段PrimeNG這個框架
https://www.primefaces.org/primeng/#/setup 從官網可以學習到如何安裝和使用。
這裏寫圖片描述

可以很方便從左邊找到的控件如何使用。
快速總結下安裝方法: 引文angular 4.0 以上的版本都需要 Animations
- npm install primeng –save 在項目路徑下 安裝PrimeNG
- npm install @angular/animations –save 安裝新特性animations
- nmp install font-awesome –save 裝置依賴圖標樣式

在.angular-cli.json cli文件中添加默認引用樣式
"styles": [  "../node_modules/font-awesome/css/font-awesome.min.css",  "../node_modules/primeng/resources/themes/omega/theme.css",
"../node_modules/primeng/resources/primeng.min.css",
  //...
],          

使用PrimeNG控件測試下成功顯示。
這裏寫圖片描述

AngularJS Material 開發學習:npm安裝教程
https://material.angular.io/guide/getting-started
# To install latest release and update package.json
npm install –save @angular/material @angular/cdk
在項目根路徑下安裝類庫
安裝完會看到package.json下面多了個
“@angular/cdk”: “^5.0.1”,
“@angular/material”: “^5.0.1”,

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章