AngularJS: ng-repeat with key value - updating object

前端 未结 3 930
鱼传尺愫
鱼传尺愫 2021-02-20 10:36

I am rendering key:value object array with ng-repeat like this:

<
3条回答
  •  失恋的感觉
    2021-02-20 11:16

    After scratching my head to the bone, i find a way to update object key names. It is a bit twisted but it works for me.

    replace

    
    

    with

    
    

    you will need the 'lineKey' directive just to keep focus on your input

    var app = angular.module('myApp',[]);
    var focus_key=-1;
    app.directive('lineKey', function () {
        return function (scope, element, attrs) {
            if(focus_key==scope[attrs.ngModel]){
                focus_key=-1;
                element[0].focus();
            }
        };
    });
    

    finally, add the 'update_key' method to your controller

    app.controller('mainCtrl',['$scope'],function($scope){
            $scope.records = [
            {'key1':'val1'},
            {'key2':'val2'}
        ];
        $scope.update_key=function(obj,new_key,id){
            var keys    = Object.keys(obj);
            var values  = Object.values(obj);
            var old_key = keys[id];
            if(keys.indexOf(new_key)==-1&&new_key.length>0){
                // clear ...
                for(var i=0,key;key=keys[i];i++){   delete obj[key];    }
                keys[id]=new_key;//... change key value ...
                focus_key=new_key;//... notify to keep focus on modifyed input ...
                // ... and refill to preserve the position in the object list
                for(var i=0,key;key=keys[i];i++){   obj[key]=values[i]; }
            }
        };
    }
    

提交回复
热议问题