angular学习

1、资料篇

http://www.ngnice.com/

http://www.yiibai.com/angularjs

http://www.angularjs.cn/

http://www.w3cschool.cc/angularjs/angularjs-reference.html

http://developer.51cto.com/art/201311/416334.htm

扎西博客：http://www.cnblogs.com/whitewolf/

开发经验 http://www.cnblogs.com/whitewolf/archive/2013/03/24/2979344.html

2、经验篇

$http.post(url,para) 垮与访问时会先发OPTION请求，导致服务端无法响应，可以使用jquery的$,post规避。默认post数据为request payload，需要转为form data，否则服务端收不到post的数据。可以采用增加消息头{'Content-Type': 'application/x-www-form-urlencoded'

$injector:modulerr错误：按照错误信息是加载的模块缺失，但是实际上并未使用额外的模块。新建一个文件，分步复制过来后，没有出现此错误。问题很奇怪。

为http请求增加等待画面：http://windrocblog.sinaapp.com/?p=1541

checkbox 使用ng-model 绑定数据时，必须是bool类型，否则全部认为未选中。 而ajax返回数据中默认是字符串，导致无法绑定，需要自己转换成bool

使用百度的ueditor时，ng-model失效，一种方法是直接操作ue对象赋值和取值，一种是封装angular 参考：http://www.oschina.net/p/angular-ueditor/similar_projects

ng-repeat 如果内部赋值使用的是{{}}，如果数据为空，会出现页面显示赋值语句，而使用ng-bind则不会有此问题。

class=“cid”  ng-repeat……   今天遇到这个问题，由于class和ng-repeat之间的空格是全角状态下的空格，导致ng-repeat失效

ng-repeat="dept in deptList | filter:searchKey track by $index" 注意，filter要放在track前面，否则过滤器不生效

ng-repaet 如果使用了filter则不能使用index做参数来进行数组操作。可以使用item做参数

ng-repeat生成jquery mobile折叠菜单时，需要在repeat完成后执行$("#mylist").trigger("create");

<div id="mylist">
<div data-role="collapsible" ng-repeat="catalog in catalog_list | filter: isDependent"> 
    <h6>
       {{ catalog.catalog_name }} 
       <span ng-show="catalog.next"> 
           <a  ng-click="changeCurrent(catalog.catalog_id)"> {{ catalog.next }}</a>
       </span>
    </h6> 
    <p>some Content</p>
</div>
</div>

定义ng-repeat完成事件

.directive('onFinishRenderFilters', function ($timeout) {
    return {
        restrict: 'A',
        link: function(scope, element, attr) {
            if (scope.$last === true) { //判断是否完成，如果是nr-options无须判断，因为只执行一次，而ng-repeat则重复执行多次
                $timeout(function() {
                    scope.$emit('ngRepeatFinished');
                });
            }
        }
    };
})
<div ng-repeat="item in items" on-finish-render-filters>
$scope.$on('ngRepeatFinished', function (ngRepeatFinishedEvent) {
        //do something
    });

3、最佳实践

《AngularJS开发人员最常犯的10个错误》  http://blog.jobbole.com/78946/

4、经验

IE8兼容，chrome和FF，IE11正常，ie8异常。先是按照官方指导操作，没有效果，最后摸索结果为：使用1.2版本,引用的第三方组件和angular冲突，替换掉该组件解决。

另外IE8 ajax请求缓存了，需要在每个get的url后加随机数 url + "&" + Math.random()