Angular面试方面的问题

1. ng-if 跟 ng-show/hide 的区别有哪些？
第一点区别是，ng-if 在后面表达式为 true 的时候才创建这个 dom 节点，ng-show 是初始时就创建了，用 display:block 和 display:none 来控制显示和不显示。
第二点区别是，ng-if 会（隐式地）产生新作用域，ng-switch 、 ng-include 等会动态创建一块界面的也是如此
2. factory、service 和 provider 是什么关系？

//factory,把 service 的方法和数据放在一个对象里，并返回这个对象
app.factory('FooService', function(){
    return {
        target: 'factory',
        sayHello: function(){
            return 'hello ' + this.target;
        }
    }
});

//service通过构造函数方式创建 service，返回一个实例化对象
app.service('FooService', function(){
    var self = this;
    this.target = 'service';
    this.sayHello = function(){
        return 'hello ' + self.target;
    }
});

//provider创建一个可通过 config 配置的 service，$get 中返回的，就是用 factory 创建 service 的内容
app.provider('FooService', function(){
    this.configData = 'init data';
    this.setConfigData = function(data){
        if(data){
            this.configData = data;
        }
    }
    this.$get = function(){
        var self = this;
        return {
            target: 'provider',
            sayHello: function(){
                return self.configData + ' hello ' + this.target;
            }
        }
    }
});
// 此处注入的是 FooService 的 provider
app.config(function(FooServiceProvider){
    FooServiceProvider.setConfigData('config data');
});

从底层实现上来看，service 调用了 factory，返回其实例；factory 调用了 provider，返回其 $get 中定义的内容。factory 和 service 功能类似，只不过 factory 是普通 function，可以返回任何东西（return 的都可以被访问，所以那些私有变量怎么写，你懂的）；service 是构造器，可以不返回（绑定到 this 的都可以被访问）；provider 是加强版 factory，返回一个可配置的 factory。
3. angular 的数据绑定采用什么机制？详述原理
脏检查机制。
双向数据绑定是 AngularJS 的核心机制之一。当 view 中有任何数据变化时，会更新到 model ，当 model 中数据有变化时，view 也会同步更新，显然，这需要一个监控。
原理就是，Angular 在 scope 模型上设置了一个 监听队列，用来监听数据变化并更新 view 。每次绑定一个东西到 view 上时 AngularJS 就会往 $watch 队列里插入一条$watch，用来检测它监视的 model 里是否有变化的东西。当浏览器接收到可以被 angular context 处理的事件时，$digest 循环就会触发，遍历所有的$watch，最后更新 dom。
4. Angular的directive（自定义指令）
app.directive('testDirective', function() {
// 将对象return出去
return{
restrict: 'E',
// 指令类型E：element A：attribute M：comment C:class，默认状态下是EA, 即可以通过元素名和属性名来调用指令
template: '<div>我是指令生成的内容</div>';
//template如果过长建议使用templateUrl为从指定地址获取模板内容。即你要在指令所在的容器中插入的一个.html文件
replace: true, //使用模板替换原始标记 指令内原本的数据将被清空，false ：则append（追加）在当前元素上，即模板的内容包在标签内部。默认false。
}
});
5. 解释下什么是rootScrope以及和scope的区别？
通俗的说$rootScrope 页面所有$scope的父亲。
我们来看下如何产生$rootScope和$scope吧。
step1:Angular解析ng-app然后在内存中创建$rootScope。
step2:angular回继续解析，找到{{}}表达式，并解析成变量。
step3:接着会解析带有ng-controller的div然后指向到某个controller函数。 这个时候在这个controller函数变成一个$scope对象实例。
6.Angular优缺点
优点：1.模板功能强大丰富，并且是声明式的，自带了丰富的Angular指令；
2. 是一个比较完善的前端MVC框架，包含模板，数据双向绑定，路由，模块化，服务，过滤器，依赖注入等所有功能；
3. 自定义Directive(指令)，比jQuery插件还灵活，但是需要深入了解Directive的一些特性，简单的封装容易，复杂一点官方没有提供详细的介绍文档，可以通过阅读源代码来找到某些我们需要的东西，如：在directive使用 $parse；
4. ng模块化比较大胆的引入了Java的一些东西（依赖注入），能够很容易的写出可复用的代码，对于敏捷开发的团队来说非常有帮助。
缺点：1. 验证功能错误信息显示比较薄弱，需要写很多模板标签，没有jQuery Validate方便，所以可以自己封装了验证的错误信息提示；
2. ngView只能有一个，不能嵌套多个视图，虽然有
angular-ui/ui-router · GitHub 解决，但是貌似ui-router 对于URL的控制不是很灵活，必须是嵌套式的；
3. 对于特别复杂的应用场景，貌似性能有点问题，特别是在Windows下使用chrome浏览器，不知道是内存泄漏了还是什么其他问题，没有找到好的解决方案，奇怪的是在IE10下反而很快；
4. 这次从1.0.X升级到1.2.X，貌似有比较大的调整，没有完美兼容低版本，升级之后可能会导致一个兼容性的BUG，具体详细信息参考官方文档
AngularJS ，对应的中文版本：Angular 1.0到1.2 迁移指南
5. ng提倡在控制器里面不要有操作DOM的代码，对于一些jQuery 插件的使用，如果想不破坏代码的整洁性，需要写一些directive去封装插件，但是现在有很多插件的版本已经支持Angular了，如：jQuery
File Upload Demo
6. Angular 太笨重了，没有让用户选择一个轻量级的版本，当然1.2.X后，Angular也在做一些更改，比如把route，animate等模块独立出去，让用户自己去选择。.