重构与动态为angularjs栏位赋值或获取值

先来看下面一段html：

 

 

这个ng-model名称带有一定的规律带有序号。

 
先来实现数据绑定，从数据取到数据后，为ng-model绑定相对应的值：

 

var c = response.data

                    $scope.start1 = $filter("jsondateformat")(c.start1, "yyyy-mm-dd");
                    $scope.start2 = $filter("jsondateformat")(c.start2, "yyyy-mm-dd");
                    $scope.start3 = $filter("jsondateformat")(c.start3, "yyyy-mm-dd");
                    $scope.start4 = $filter("jsondateformat")(c.start4, "yyyy-mm-dd");
                    $scope.start5 = $filter("jsondateformat")(c.start5, "yyyy-mm-dd");
                    $scope.start6 = $filter("jsondateformat")(c.start6, "yyyy-mm-dd");
                    $scope.start7 = $filter("jsondateformat")(c.start7, "yyyy-mm-dd");
                    $scope.start8 = $filter("jsondateformat")(c.start8, "yyyy-mm-dd");
                    $scope.start9 = $filter("jsondateformat")(c.start9, "yyyy-mm-dd");
                    $scope.start10 = $filter("jsondateformat")(c.start10, "yyyy-mm-dd");
                    $scope.start11 = $filter("jsondateformat")(c.start11, "yyyy-mm-dd");
                    $scope.start12 = $filter("jsondateformat")(c.start12, "yyyy-mm-dd");
                    $scope.start13 = $filter("jsondateformat")(c.start13, "yyyy-mm-dd");
                    $scope.end1 = $filter("jsondateformat")(c.end1, "yyyy-mm-dd");
                    $scope.end2 = $filter("jsondateformat")(c.end2, "yyyy-mm-dd");
                    $scope.end3 = $filter("jsondateformat")(c.end3, "yyyy-mm-dd");
                    $scope.end4 = $filter("jsondateformat")(c.end4, "yyyy-mm-dd");
                    $scope.end5 = $filter("jsondateformat")(c.end5, "yyyy-mm-dd");
                    $scope.end6 = $filter("jsondateformat")(c.end6, "yyyy-mm-dd");
                    $scope.end7 = $filter("jsondateformat")(c.end7, "yyyy-mm-dd");
                    $scope.end8 = $filter("jsondateformat")(c.end8, "yyyy-mm-dd");
                    $scope.end9 = $filter("jsondateformat")(c.end9, "yyyy-mm-dd");
                    $scope.end10 = $filter("jsondateformat")(c.end10, "yyyy-mm-dd");
                    $scope.end11 = $filter("jsondateformat")(c.end11, "yyyy-mm-dd");
                    $scope.end12 = $filter("jsondateformat")(c.end12, "yyyy-mm-dd");
                    $scope.end13 = $filter("jsondateformat")(c.end13, "yyyy-mm-dd");  

 

以上方法，最原始了，一一绑定。有没有一个简单一点的，只实现名称序号循环。

 

var c = response.data

                    var objs = [
                        { s: c.start1, e: c.end1 },
                        { s: c.start2, e: c.end2 },
                        { s: c.start3, e: c.end3 },
                        { s: c.start4, e: c.end4 },
                        { s: c.start5, e: c.end5 },
                        { s: c.start6, e: c.end6 },
                        { s: c.start7, e: c.end7 },
                        { s: c.start8, e: c.end8 },
                        { s: c.start9, e: c.end9 },
                        { s: c.start10, e: c.end10 },
                        { s: c.start11, e: c.end11 },
                        { s: c.start12, e: c.end12 },
                        { s: c.start13, e: c.end13 }
                    ];                                       

                    var i = 1;
                    while (i <= 13) {
                        $scope['start' + i] = $filter("jsondateformat")(objs[i - 1].s, "yyyy-mm-dd");
                        $scope['end' + i] = $filter("jsondateformat")(objs[i - 1].e, "yyyy-mm-dd");

                        i++;
                    }

 

这样一改，简洁多了。不过还得把获取的数据源进行一次转换为阵列。

下面第3次修改：

 

 var i = 1;
                    while (i <= 13) {
                        $scope['start' + i] = $filter("jsondateformat")(c['start' + i], "yyyy-mm-dd");
                        $scope['end' + i] = $filter("jsondateformat")(c['end' + i], "yyyy-mm-dd");

                        i++;
                    }

 

ok,讲完绑定，现在我们来说说获取ng-model的值：

 

object.start1 = $scope.start1;
            object.start2 = $scope.start2;
            object.start3 = $scope.start3;
            object.start4 = $scope.start4;
            object.start5 = $scope.start5;
            object.start6 = $scope.start6;
            object.start7 = $scope.start7;
            object.start8 = $scope.start8;
            object.start9 = $scope.start9;
            object.start10 = $scope.start10;
            object.start11 = $scope.start11;
            object.start12 = $scope.start12;
            object.start13 = $scope.start13;
            object.end1 = $scope.end1;
            object.end2 = $scope.end2;
            object.end3 = $scope.end3;
            object.end4 = $scope.end4;
            object.end5 = $scope.end5;
            object.end6 = $scope.end6;
            object.end7 = $scope.end7;
            object.end8 = $scope.end8;
            object.end9 = $scope.end9;
            object.end10 = $scope.end10;
            object.end11 = $scope.end11;
            object.end12 = $scope.end12;
            object.end13 = $scope.end13;  

 

以上，也是最原始的获取方法，一个一个进行获取。

从上面的绑定方法与原理，我们对获取ng-model有值，也可以使用循环的方法来进行。

 

 

 var i = 1;
            while (i <= 13) {
                object['start' + i] = $scope['start' + i];
                object['end' + i] = $scope['end' + i];
                i++;
            }