Angular1.0和vue的区别

(1)搭建的框架

搭建vue的模板框架

vue-cli脚手架步骤操作简单。

第一步，全局安装cnpm install vue-cli -g;

第二步，vue init webpack my-project;

第三步,cd my-project;

第四步，npm install;

第五步,npm run dev;

angular1.0的框架

angular1.0的框架是手动搭建，到angular2.0就有自己的脚手架了angular-cli

(2)数据的渲染

Vue的数据渲染：

    
    
     
        {
   {item.title}}    
    

angular的数据渲染:

    
    
                     
      
            
       
{
   {news.title}}
            
       
{
   {news.createTime}}
        
      
    
    

angular用的指令是ng-前缀的，而vue是v-，风格其实一样的，数据绑定的方式也是一样的两个{}。

(3)Angular\Vue解决页面数据加载时出现{

{message}}闪烁的情况

vue使用v-cloak

    
     {
   {message}}
    

angular使用ng-cloak或者是ng-bind代替

    
     {
   {message}}
    

    
  
     
Hello 
    

angular和vue挂载数据和方法

vue挂载数据和方法

var V = new Vue({    el:"#app",    data:{        list:[],        name:''    },    methods:{        method:function(){            console.log("angular");        }    }})

angular挂载数据和方法

var app = angular.module('myApp', []);app.controller('customersCtrl', function($scope) {    $scope.list = [{},{},{}];    $scope.method = function(){        console.log("angular");    }})

vue的数据和方法都是挂载在vue上，只是数据挂载在vue的data,方法挂载在vue的methods上。

angular1.0 的所有数据和方法都是挂载在$scope上。

vue的代码风格更加优雅。