After implementing the Plunker provided above, I noticed that the rowId is increasing with alphabets, as shown below:
The component in the Plunker contains buttons labeled with +, ++, and -. When you press the + button, the rowId starts from the first alphabet (i.e. A). Pressing ++ adds to the parent rowId starting with the initial alphabet (e.g. AA). Subsequent presses of ++ continue this pattern (e.g. AAA) and so on.
To see the functionality in action, please visit the Plunker here.
However, I am looking to achieve similar functionality using numbers instead.
When a single plus is pressed, it should display 1. For each ++ press, it should show 111 in sequence. This is the behavior I would like to achieve.
Could someone assist me in implementing this functionality?
var newRow = {
"rowId": "A"
}
$scope.componentList = [];
$scope.componentList.push(angular.copy(newRow));
$scope.addParentRow = function(rowId) {
var newGridRow = angular.copy(newRow);
var lastChar = getListOfSameLevel(rowId, true); //isParentRow
var parentId = rowId.length > 1 ? rowId.slice(0, rowId.length - 1) : "";
newGridRow.rowId = parentId + getNextChar(lastChar);
$scope.componentList.push(newGridRow);
}
$scope.addChildRow = function(rowId) {
var newGridRow = angular.copy(newRow);
var lastChar = getListOfSameLevel(rowId, false);
if (rowId.length === lastChar.length) {
newGridRow.rowId = rowId + "A";
} else {
var parentId = lastChar.length > 1 ? lastChar.slice(0, lastChar.length - 1) : "";
newGridRow.rowId = parentId + getNextChar(getLastChar(lastChar));
}
$scope.componentList.push(newGridRow);
};
var getNextChar = function(inputChar) {
return String.fromCharCode(inputChar.charCodeAt(0) + 1);
};
var getLastChar = function(fullStr) {
return fullStr.slice(-1);
};