Unable to match a subtasks to its parent tasks REST API

Question

I am able to get the tasks and subtasks from a SharePoint list using the REST API. How can I match a subtask with its parent task? The following JS inside an AngularJS controller returns two lists, subtasks, and maintasks. The subtasks have a ParentID property that shows the id number of the parent. However, the parent does seem to have a property that I can match that id number to.

$scope.subtasks = $scope.projects.filter(project => {
    return project.ParentID.Id;
})
console.log($scope.subtasks);

$scope.maintasks = $scope.projects.filter(project => {
    return !project.ParentID.Id;
})
console.log($scope.maintasks);

This is one of the returned parent tasks:

0:
$$hashKey: "object:3"
AssignedTo: {results: Array(1)}
Assigned_x0020_Team: {__metadata: {…}, results: Array(1)}
DueDate: null
OPR: {__metadata: {…}, results: Array(1)}
ParentID:
__deferred: {uri: ".../_api/Web/Lis…-c959-45d4-a94d-319a5b9dbf80')/Items(21)/ParentID"}
__proto__: Object
PercentComplete: 0
Status: "Not Started"
Title: "FMC Data Degraded In Blue"
__metadata: {id: "Web/Lists(guid'1900342c-c959-45d4-a94d-319a5b9dbf80')/Items(21)", uri: "https://.../_api/Web/Lis…'1900342c-c959-45d4-a94d-319a5b9dbf80')/Items(21)", etag: ""15"", type: "SP.Data.NET_x0020_ProjectListItem"}
__proto__: Object

This is one of the returned subtasks:

29:
AssignedTo: {results: Array(3)}
Assigned_x0020_Team: {__metadata: {…}, results: Array(1)}
DueDate: "2021-04-29T22:00:00Z"
OPR: {__metadata: {…}, results: Array(2)}
ParentID:
Id: 43
__metadata: {id: "b742ae27-ebf6-4b74-b5ea-0bc75895c590", type: "SP.Data.CNDNET_x0020_ProjectListItem"}
__proto__: Object
PercentComplete: 0
Status: "Not Started"
Title: "Second Circuit"
__metadata: {id: "Web/Lists(guid'1900342c-c959-45d4-a94d-319a5b9dbf80')/Items(104)", uri: "https://.../_api/Web/Lis…1900342c-c959-45d4-a94d-319a5b9dbf80')/Items(104)", etag: ""2"", type: "SP.Data.NET_x0020_ProjectListItem"}
__proto__: Object
length: 30
__proto__: Array(0)

Answer 1

You can extract the main tasks and subtasks in separate arrays in success function like:

var mainTasks = [], subTasks = [];
for(var i = 0; i < data.length; i++) {
    if(data[i].ParentID.Id) {
        subTasks.push(data[i]);
    } else {
        mainTasks.push(data[i]);
    }
}

For more information check this:

1. Sharepoint 2013 rest api group subtask with respective main task?
2. SharePoint 2013 group list task and subtask via the rest api not working