upgrading into Components

I have just started learning to develop an angularJS app,with my final objective being updating the angular version. As an initial step I wanted to remove $scope and refactor the following code into components. I have tried replacing $scope with ‘this’ but it somehow seems to break the code. Can anyone show me how to go about this?

Tool.showTool({ catalogId: catalogId, data: 'showTool' },
            function (data) {
                $scope.catalog = data;
                $scope.tools = data.tools;
                $scope.tools.filters = [];
                $scope.tools.applicableFlagValues = [];
                for (var index = 0; index < data.tools.length; index++) {
                    data.tools[index].category = angular.copy(data.tools[index].subCategory.tsCategory.category);
                    data.tools[index] = $scope.initItem($scope, data.tools[index], catalogId);
                }
                angular.forEach($scope.tools, function (detailedTool) {
                    GenericFilterService.addFilterItemsAsProperty(detailedTool, $scope.tools.filters);
                    ApplicableFlagService.addFlagValuesAsProperty(detailedTool, $scope.tools.applicableFlagValues);
                });

                if (nfrId !== undefined && nfrId !== '') {
                    Tool.calculateToolsProgressScoring({ tools: $scope.tools, nfrId: nfrId }, function (data, headers) {
                        var toolProgressList = data.result;
                        for (var index = 0; index < $scope.tools.length; index++) {
                            $scope.tools[index].progressCode = toolProgressList[index].progress;
                            $scope.tools[index].scoringVal = toolProgressList[index].scoring;
                            $scope.tools[index].criticalityAns = toolProgressList[index].criticality;
                            $scope.tools[index].compliancyAns = toolProgressList[index].compliancy;
                            $scope.tools[index].compliantAnsCount = toolProgressList[index].compliantAnsCount;
                            $scope.tools[index].totalAnsCount = toolProgressList[index].totalAnsCount;
                        }
                    });
                }

                if (tsId !== undefined && tsId !== '') {
                    Tool.calculateToolsProgressPerTs({ tools: $scope.tools, tsId: tsId }, function (data, headers) {
                        var toolProgressList = data.result;
                        for (var index = 0; index < $scope.tools.length; index++) {
                            $scope.tools[index].tsProgressCode = toolProgressList[index].progress;
                            $scope.tools[index].tsUsageAns = toolProgressList[index].usage;
                            $scope.tools[index].tsVersAns = toolProgressList[index].version;
                            $scope.tools[index].tsOtherVersAns = toolProgressList[index].otherversion;
                            $scope.tools[index].compliancyAns = toolProgressList[index].compliancy;
                        }
                    });
                }


            });

Source: AngularJS