AngularJS之双向数据绑定,class绑定

之前一直都是用vue来完成一些日常开发，初入AngularJS,记录一些日常开发遇到的问题。

1、双向数据绑定

　　AngularJS与vue的区别在于，vue采用的是虚拟DOM，模板文件上绑定的一大堆指定指令什么的，最终并不会被编译到HTML DOM中，而AngularJS模板文件中编写的指令会切实存在HTML DOM中，作为元素的一个属性。这一点就决定了再vue中动态绑定v-model的方式为首先初始化好数据，然后再动态匹配，无法通过操纵元素属性的方式来实现：

<el-input v-if="item.type==='input'" :type="item.inputType" v-model='formData[item.id]'
                              autocomplete="off" :placeholder="item.placeholder ? item.placeholder : ''"></el-input>

在AngularJS中，可以通过手动设置元素属性，然后再编译成AngularJS元素，具体实现如下：

angular.element($input).attr('ng-model', inputModel);
$compile(angular.element($input))($scope);

2、class绑定

vue比较通俗易懂，直接:class={classA：true/fasle,classB: true/false}；

AngularJS中，就有点区别了，true/false的class名用空格分开，根据中括号里面的判断条件的真假来决定显示的class,具体实现如下：

ng-class="{true:'fa fa-angle-up',false:'fa fa-angle-down'}[menu.orderManager]"

[]中的表达式是判断条件