① nodejs 和angularjs有什麼關系，angualr是前端的東西，為什麼需要Nodejs
angular用nodejs主要是用它的npm工具包，npm裡面有很多很方便的工具可以用在前端開發，例如
- 合並js,css
- 壓縮js
- 壓縮圖片
- 生成js的source map
- 編譯 less 成css
- 運行測試unit test
- Grunt, Gulp任務管理，自動化上面所有的任務
② 關於AngularJS 框架的使用有哪些經驗值得分享
AngularJS 與 jQuery 等傳統操作 DOM 的思想有所不同，對於 jQuery 等，一般是先有完整 DOM 然後在這些 DOM 的基礎上進行二次調教。
而 AngularJS 等框架則是 根據 數據模型 以及其對應的 DOM 模版，然後通過模版像搭積木那樣組合頁面。
顯然的，前者在 SEO 上有天然優勢；而後者，搜索引擎還只能拿到某個模版，而無內容。
暫時沒想到有什麼特別好的解決方案，或許，對於內容頁，可以繼續使用傳統方式，而只在需要更多交互的地方應用 AngularJS，特別是在移動端應用上。
同理適用於各種 前端的 MVC 框架，後端只要為前端提供數據介面，而不再需要為其拼接 HTML.
## 模塊化
AngularJS 也是遵循 AMD 的。（AMD 是啥，參考：使用 AMD、CommonJS 及 ES Harmony 編寫模塊化的 javaScript）
雖然它也可以按照傳統代碼方式來寫（其首頁介紹的用法 AngularJS — Superheroic JavaScript MVW Framework），但是，既然都提供了這么一種模塊的方法，為何不用上呢
angular.mole('app', [
'moleA',
'moleB',
])
.controller('MainCtrl', [
'$scope',
function ($scope) {
}]);
而且，這種寫法還可以方便做代碼的合並與壓縮，在後面 Grunt 自動化 一節中，就會提到使用 Nodejs/Grunt 來自動的做這些事情。
## 可復用模版 or 業務邏輯模版
今年 Google 開發者大會中 提到的 Polymer（Welcome - Polymer）
這貨讓人感覺像是 Angular Directives 的進化。
而 Directives 做的事，就是把一堆 DOM 封裝為一條或者一組 自定義的 HTML標簽，作為可復用的模版，以供組裝業務調用。 Demos 可參看：Angular directives for Twitter's Bootstrap
當然，為了方便修改，很多時候在做 directive 的時候需要將 template 用 templateUrl 代替，
不用擔心文件的碎片化，不利於前端載入 Grunt 自動化 一節 會提到如何合並這些碎片化的 模版。
Directives 是作為可復用的模版，
而業務邏輯則是一般是一個業務對應一個 html 及其的 controller.
③ AngularJS製作的網頁怎麼提高訪問速度
1.把需要用到的JS文件依賴全部壓縮。 2.按需載入，就是需要依賴哪些JS文件就載入哪些JS文件。 3.使用CDN。 數據做緩存，壓縮合並代碼 angular相對於react來說，首次載入真的是慢，沒辦法，react可以根據生命周期來決定何時載入。
④ 請教大神 用angularjs怎麼寫點擊圖片放大 跪謝！
img.normal{
width : 100px;
}
img.big{
width:200px;
}
<img src="xxx" ng-click="zoom()" ng-class="{normal : n,big : b}" />
var i =0;
$scope.n = true;
$scope.b = false;
$scope.zoom = function(){
if( i%2 == 0){
$scope.n = false;
$scope.b = true;
}else{
$scope.n = true;
$scope.b = false;
}
}
⑤ angularjs如何實現圖片延遲載入
jquery的做法是監聽window.scroll，然後判斷圖片的位置，是否需要切換src屬性，那麼angular也一樣，只是由於angular需要將DOM操作寫在指令裡面，所以需要自己去實現指令。
解決思路：
1，圖片的src不要使用真實的地址，用一個屬性保存在元素上
2，把所有需要使用延遲載入的圖片放到一個數組中，
3，初始化的時候檢查數組中的元素是否在可視范圍內，可視范圍內即載入
4，給window綁定滾動事件檢查圖片是否在可視范圍內
5，載入完成的圖片從隊列中刪除
⑥ angularjs用什麼壓縮軟體
angularjs是由Google團隊開發的一款非常優秀web前端框架。在當前如此多的web框架下，angularjs能脫穎而出，從架構設計上就高人一等，雙向數據綁定，依賴注入，指令，MVC，模板。Angular.js創新地把後台技術融入前端開發，掃去jQuery一度的光芒。用angularjs就像寫後台代碼，更規范，更結構化，更可控。
WebStorm 是jetbrains公司旗下一款JavaScript 開發工具。被廣大中國JS開發者譽為「Web前端開發神器」、「最強大的HTML5編輯器」、「最智能的JavaSscript IDE」等。與IntelliJ IDEA同源，繼承了IntelliJ IDEA強大的JS部分的功能。
⑦ AngularJS 官網教程重點
python">標識在線/登錄/空閑未超時
避免重復提交，可能導致重復存庫
4組織目錄和文件（重構）
目的
1.模塊化-代碼復用
2.容易跟讀代碼
容易定位某個功能(features)的代碼段
做法
按功能(features)分
為應用的每個功能(feature/section)建立目錄，盛放該功能相關的文件，如app/phone-list
當你發現了很多功能(part)共用的內容，就放到目錄如coresharedcommon
使用模塊(moles)-相當於java中的包(package)
好處：
代碼復用，甚至是跨應用的復用
做法
為應用的每個部分(feature/section)聲明其mole，並在其中注冊相關的實體(entities)如component
主模塊(mainmole)聲明依賴到其它各功能模塊(feature/sectionmole)
若要在其它app中復用模塊，只需
1.復制模塊目錄
2.給主模塊添加依賴到該模塊
3.index.html添加新的<script>
注意：對於要上線的產品(proction-ready)，別忘了優化js文件：拼接和最小化
示例結構，見網頁
外部模板
頻繁的請求開銷如何避免，不在本教程范圍，另見參考
測試重構
5加些簡單的東西-手機信息全文搜索
外部模板，代碼見網頁
管道，filter函數
ng-repeat="phonein$ctrl.phones|filter:$ctrl.query"
ng特性：數據綁定-數據模型的改變會立即體現到視圖
此章節，輸入框內容的改變會立即體現為手機列表的改變
E2E測試
單元測試適用於：測試如controller這樣的自編寫js代碼
E2E測試適用於：測試如template,DOM操作，組件間互操作性，service
6雙向綁定
控制列表順序
7XHR，依賴注入
通過controller構造方法的參數注入，如functionPhoneListController($http)
防止js壓縮時將方法參數壓縮造成注入失效，[注入服務…,Controller構造]
8模板鏈接，圖片
9路由，多視圖
本節，創建布局模板(layouttemplate)，包入多個路由視圖，通過使用ngRoute模塊
依賴
bower.json中添加依賴
"angular-route":"1.5.x"
執行npminstall
注意：最近一次執行如上命令時，如果有新的AngularJS版本釋出，會出現沖突問題
解決：刪掉/bower_components目錄，重新執行如上命令
注入器
應用啟動時，創建注入器
注入器按如下步驟工作
1.載入自定義模塊
2.載入所有定義在以上模塊中（配製在config方法中）的供給器
3.被請求注入時，由供給器實例化各service及其依賴(懶載入)，作為參數注入到目標方法中
供給器
創建service
暴露configurationAPI
控制service的創建和運行時行為
供給器只能注入到config方法中
ng-view屬性
在布局模板中，無值，用以包入其他路由視圖（串式組件名）
locationProvider
$location服務的出現，是為了給那些不支持H5push-state導航的瀏覽器提供hash前綴支持
子模塊依賴
為了復用，盡量獨自聲明所依賴的模塊，不要因為上級已有依賴而省略當前模塊的依賴聲明
10更多模板
本節實現手機明細視圖
11自定義過濾器
本節，用自定義的過濾器，將手機詳情頁面的true和false顯示為對鉤u2713和叉號u2718(unicode字元)
自定義「檢查標記過濾器」
這是個通用過濾器，定義在core目錄下(core模塊下)
如何定義，同component定義，在mole後調用filter方法，放在單獨的文件.filter.js
將core模塊js和自定義過濾器js，加入到index.html
使用過濾器，語法如{{expression|filter}}
12事件處理器
AngularJS指令包含所有原生JS事件
13REST，自定義服務
本節，獲取數據換用另一方式
自定義（封裝）一個服務，作為RESTful客戶端，寫更少的代碼即可發送請求
(只需調用封裝體，不必操作底層的$httpAPI,httpmethod和URLs)
依賴
RESTful功能由AngularJS的ngSource模塊提供，在bower.json添加如下依賴：
"angular-resource":"1.5.x"
執行npminstall
注意沖突問題，見9路由
注冊自定義服務到模塊core.phone下
factory方法
具體js代碼見網頁：代碼，相關聯的依賴聲明
phone.mole.js模塊聲明，依賴ngResource
phone.service.js
index.html包入如下新<script>
angular-resource.js
phone.mole.js
phone.service.js
重寫原來的phone-list和phone-detail模塊內容
通過調用自封裝的RESTful客戶端，替換原來的$http操作
factory定義和調用明細，見API
14動畫(Animations)
本節，將在之前模板頂部添加CSS和JS動畫，以改善ourAPP
ngAnimate模塊
需用內置指令，自動觸發目標動畫的鉤子
動畫被發現時，會在給定時間跟隨某元素的DOM操作而執行
(如增刪節點在ngRepeat，或增刪class屬性在ngClass)
依賴
bower.json
"angular-animate":"1.5.x"
"jQuery":"3.2.x"用於做JS動畫
index.html
<link>app.animations.css編寫CSS動畫
app.animations.js編寫JS動畫
jQuery和AngularJS版本一致性說明，見網頁
⑧ angularjs壓縮 變數名重復
angularjs壓縮 變數名重復如下
查找原因 ，結果是angularjs 依賴注入到Controller 中的 變數 $scope,$timeout 什麼的是根據變數名匹配的，可是壓縮後 這些局部變數 的名字就變了。所以會報依賴注入錯誤。.controller('controller', ['$scope', '$rootScope', '$http', ,function ($scope, $rootScope, $http) {}）可能是 有些包不支持 所以才報錯刪除壓縮文件中 的 「use strick」一切OK。
⑨ angular怎麼實現自動化打包壓縮
AngularJS 與 jQuery 等傳統操作 DOM 的思想有所不同， 對於 jQuery 等，一般是先有完整 DOM 然後在這些 DOM 的基礎上進行二次調教。 而 AngularJS 等框架則是 根據 數據模型 以及其對應的 DOM 模版，然後通過模版像搭積木那樣組合頁面。