angularJS实践过程当中出现的问题总结

同名服务

　　在一次项目里，以前是同事写的。我有一次在异步获取服务器上的数据时，习惯把api地址写在一个服务Store里，可是程序老是返回Store.api.get()里的get is undefined。知道确定是Store.api为空形成的缘由；可是以为应该是没有问题的才对，最后看到在页面里又从新定义了一次Store服务，因此形成了覆盖。

myApp.factory('Store',function(){
    return{
        name:'zhang',
        age:25
    }
})
myApp.factory('Store',function(){
    return{
        name:'dong',
        age:27
    }
})　　//服务同名了，因此只有最后一次的Store服务有效

建议：在项目大的时候，将项目逻辑分红多个模块，在每一个模块里写服务和逻辑。而后在注入到其余模块中，便于测试和逻辑清晰；

在查找错误上，使用先看看服务对象的输出

对象复制

　　若是将一个对象赋值给其余对象，不管赋值多少次，最后被赋值的对象都来自同一个对象的引用。

var a={}; 
var b=a; 
b.name='zhang'; 
a.name    //"zhang"

var a={};
var b={};
a==b    //false

在angularJS中，若是不想要引用的传递，可是又想得到对象里的数据。可使用angular.copy()，使用forEach() 方法，把对象里的属性和值从新复制到一个新的对象上；可是又不等于被赋值的对象； var关键词的做用就是在内存中新开一块地址吧

ng-select

angularJS中的select不像HTML代码里本身手动添加option，毕竟使用了指令，扩展了select的功能。

select元素使用ng-options生成下拉选项，只须要提供一个数组给ng-options就好，若是须要提供默认值，须要给select的绑定模型变量赋值

使用ng-options的时候必须给select绑定模型变量ng-model，不然会出错误：[$compile:ctreq] http://errors.angularjs.org/1.5.2/$compile/ctreq?p0=ngModel&p1=ngOptions

<div ng-controller="myController">
    <select ng-model="glass" ng-options="o.op as o.type for o in operation">
    </select>
</myController>
<script>
myApp.controller('myController', function($scope){
    $scope.operation=[
        {type: '大于', op: '>'},
        {type: '大于等于', op: '>='},
        {type: '小于等于', op: '<='},
        {type: '等于', op: '='},
        {type: '小于', op: '<'},
        {type: '不等于', op: '<>'},
        {type: '包含', op: ',like'},
        {type: '不包含', op: 'notlike'}
    ];
})
</script>

可是你查看源代码就会看到，angularJS自动在option的value属性里把value值前加了字段类型

<option label="大于等于" value="string:>=">大于等于</option>

也能够本身手动添加option

<select ng-model="glass">
    <option value="1">one</option>
    <option value="2">two</option>
</select>

Note：麻烦就是手动添加的option的value都是字符串，初始化的时候，$scope.glass="必须是引号引发来的字符串"; 可是ng-select就比较灵活了，使用ng-options就能够给value传基本类型（数字，字符串，布尔值）和对象类型，在初始化的时候赋对应类型的值，调用的时候也获取的是对应类型的数据；

<select ng-model="glass" ng-options="o.id as o.name for o in num" class="ng-pristine ng-valid ng-not-empty ng-touched">
    <option value="?" selected="selected"></option>
    <option label="one" value="boolean:true">one</option>
    <option label="two" value="boolean:false">two</option>
</select>

<select ng-model="glass" ng-options="o.id as o.name for o in num" class="ng-pristine ng-untouched ng-valid ng-not-empty">
    <option value="?" selected="selected"></option>
    <option label="one" value="number:1">one</option>
    <option label="two" value="number:2">two</option>
</select>

添加同一个对象

在表格中，为表格新建一行，并提供一个默认值属性字段

<tr ng-repeat="user in users">
    ...
</tr>

直接push一个对象到users就好了，若是在行中使用$index，可是push到users里的对象是同一个对象（同一个对象的引用）就会出错

Error: [ngRepeat:dupes] Duplicates in a repeater are not allowed. Use 'track by' expression to specify unique keys

能够根据官方的解决方案，使用ng-repeat="user in users track by $index"；