相同:
1.數據綁定:vue和angular綁定都可以用{{}}
2.都支持內置指令和自定義指令
3.都支持內置過濾器和自定義過濾器。
區別:
1.學習成本和API 設計:vue相比於angular來說更加的簡單
angular:學習成本比較高,比如增加了dependency injiction特性。Angular 盡管學習曲線較為陡峭,但卻是構建完整復雜應用的好選擇。
vue:本身提供的API都比較簡單、直觀。Vue.js 是輕量級的開發框架,很適合開發小規模靈活的 Web 應用程序;
在 API 與設計兩方面上 vue比 angular 簡單得多,因此你可以快速地掌握它的全部特性並投入開發。
2. 性能上:
angular:依賴對數據做臟檢測,所以watcher越來越多;
vue:使用基於依賴追蹤的觀察,並且使用異步隊列更新,所有的數據都是獨立觸發的。
.vue的雙向綁定是基於ES5 的 getter/setter來實現的,而angular而是由自己實現一套模版編譯規則,需要進行所謂的“臟”檢查,vue則不需要。
因此,vue在性能上更高效,但是代價是對於ie9以下的瀏覽器無法支持。
3.運行速度:vue相當於angular要變得小巧很多,運行速度比angular快.
4.指令:vue指令用v-xxx,angular用ng-xxx
angular用的指令是ng-前綴的,而vue是v-
5.組件:vue有組件化概念,angular中沒有
6.數據存放位置: vue中數據放在data對象里面,angular數據綁定在$scope上面。
7.掛載數據方式:
angular掛載數據的方法
var app = angular.module('myApp', []);
app.controller('customersCtrl', function($scope) {
$scope.list = [{},{},{}];
$scope.method = function(){
console.log("angular");
}
})
vue掛載數據的方法
var V = new Vue({
el:"#app",
data:{
list:[{},{},{}]
},
methods:{
method:function(){
console.log("vue");
}
}
})
可以看出angular所有的數據和方法都是掛載在$scope上,
而vue的數據和方法都是掛載在vue上,只是數據掛載在vue的data,方法掛載在vue的methods上。
8.數據綁定
Angular 1 使用雙向綁定,
Vue 在不同組件間強制使用單向數據流。這使應用中的數據流更加清晰易懂。
10.總結:Vue.js 有更好的性能,並且非常非常容易優化,因為它不使用臟檢查。Angular,當 watcher 越來越多時會變得越來越慢,因為作用域內的每一次變化,所有 watcher 都要重新計算。並且,如果一些 watcher 觸發另一個更新,臟檢查循環(digest cycle)可能要運行多次。 Angular 用戶常常要使用深奧的技術,以解決臟檢查循環的問題。有時沒有簡單的辦法來優化有大量 watcher 的作用域。Vue.js 則根本沒有這個問題,因為它使用基於依賴追蹤的觀察系統並且異步列隊更新,所有的數據變化都是獨立地觸發,除非它們之間有明確的依賴關系。唯一需要做的優化是在 v-for 上使用 track-by。