升级到组件

Question

我刚刚开始学习开发angularJS应用，我的最终目标是更新angular版本。作为第一步，我想删除$ scope并将以下代码重构为组件。我试图用'this'代替$ scope，但是它似乎以某种方式破坏了代码。谁能告诉我该怎么做？

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;
                        }
                    });
                }


            });