AngularJs:Array push替换其他元素

时间:2016-08-04 07:08:15

标签: angularjs

使用ng-repeat填充列表中的数据。

HTML: -

<div ng-repeat="data in GCAList|filter:year" class="listGCA" ng-click="select()">
    <div class="listLibraryName">
        {{ data.LibraryName }}
    </div>
    <div class="listProjects">
        {{ data.Projects }}
    </div>
    <div class="listStatus">
        {{ data.Status }}
    </div>
    <div class="listYear">
        {{data.TaxYear}}
    </div>
</div>

从表单中创建一个临时变量并将值存储在其中,然后将其推送到数组中。现在推送的问题是,$$ hashkey:“object:81”自动生成,并且对于下次再次推送,生成相同的hashkey并且它替换先前在数组中插入的数据。我使用了'track by $ index':

ng-repeat="data in GCAList|filter:year track by $index" 通过$ index添加跟踪无助于避免替换

脚本文件:

var app = angular.module("Accounts", ['restangular', 'ngDialog', 'ngAnimate'])
var temp = {
    "id": 0,
    "LibraryName": "" ,
    "Projects": 0,
    "Status": "",
    "TaxYear": 0
};

app.controller("accountsController", function($scope, ngDialog, RestRepository) {
    $scope.showEGCA = false;
    $scope.showGCA = true;
    $scope.name = "";
    RestRepository.getJson().then(function(response) {
        $scope.dataList = response;
        console.log($scope.dataList);
        $scope.GCAList = $scope.dataList[0];
        console.log($scope.GCAList);
        $scope.EGCAList = $scope.dataList[1];
        console.log($scope.EGCAList);
    });
    $scope.popOpen = function() {
        ngDialog.open({
            template: 'Pop Up.html',
            scope: $scope,
            controller: function($scope) {
                $scope.cancelCOA = function() {
                    ngDialog.close();
                };
                $scope.createGCA = function() {
                    temp.id = $scope.GCAList.length + 1;
                    temp.LibraryName = $scope.name;
                    temp.Projects = 2;
                    temp.Status = "Inactive";
                    temp.TaxYear = $scope.taxYear;
                    console.log(temp);
                    $scope.GCAList.push(temp);
                    console.log($scope.GCAList);
                    ngDialog.close();
                };
            },
            closeByDocument: false,
            closeByEscape: false,
            showClose: false,
        });
    };
    $scope.gcaOpen = function() {
        $scope.showGCA = !$scope.showGCA;
        $scope.showEGCA = true;
    };
    $scope.egcaOpen = function() {
        $scope.showEGCA = !$scope.showEGCA;
        $scope.showGCA = true;
    };
});

app.config(function(RestangularProvider) {
    RestangularProvider.setBaseUrl('http://10.198.50.19:98/jsonData/');
});

app.factory("RestRepository", [
    'Restangular', function(Restangular) {
        return {
            getJson: function() {
                return Restangular.one('jsonData.json').get();
            }
        }
    }
]);

1 个答案:

答案 0 :(得分:1)

原因是,由于每次在函数调用中使用上面创建的相同对象,您将获得相同的hashkey值,然后将相同的实例添加到数组中。除去,

   var temp ={
         "id":0,
        "LibraryName":"" ,
        "Projects":0,
        "Status":"",
        "TaxYear":0
      };

并将其放在createGCA()中。你的代码看起来像,

    $scope.createGCA = function () {
                 $scope.temp ={
             "id":0,
             "LibraryName":"" ,
             "Projects":0,
             "Status":"",
             "TaxYear":0
                     };
                $scope.temp.id=$scope.GCAList.length+1;
                $scope.temp.LibraryName=$scope.name;
                $scope.temp.Projects=2;
                $scope.temp.Status="Inactive";
                $scope.temp.TaxYear=$scope.taxYear;
                console.log($scope.temp);
                $scope.GCAList.push($scope.temp);
                console.log($scope.GCAList);
                ngDialog.close();
            };