I am rendering key:value object array with ng-repeat like this:
<
-
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]; }
}
};
}