将我的Angular代码转换为TypeScript

Question

我一直在编码Angular大约一年，并取得了很大的进步。现在，每个人都在对TypeScript大喊大叫。这个主题有很多教程和博客，但似乎没有任何一致性。这个app.js文件应该如何在TypeScript中查看？

angular.module('angular10App', [ 
'ngCookies', 
'ngResource', 
'ngSanitize', 
'ui.router', 
'ui.bootstrap', 
'ngStorage', 
'cfp.loadingBar', 
'ngAnimate' 
]) 
.config(function ($stateProvider, $urlRouterProvider, $locationProvider) { 

$urlRouterProvider 
     .otherwise('/'); 

    $locationProvider.html5Mode(true); 
}); 

该控制器应该如何查看？我宁愿保持范围，所以让我们假设在路由配置中有'Controller as vm'。

angular.module('angular10App') 
.controller('ResultsCtrl', function ($scope, $stateParams, results) { 

    $scope.flightType = $stateParams.flightType; 
    $scope.selectedAirportDep = $stateParams.from; 
    $scope.selectedAirportRet = $stateParams.to; 
    $scope.depDate = $stateParams.depDate; 
    $scope.arrDate = $stateParams.arrDate; 
    $scope.class = $stateParams.class; 
    $scope.adults = $stateParams.adults; 
    $scope.children = $stateParams.children; 

    $scope.results = results; 
}); 

Answer 1

注册的模块的基本相同

angular.module('angular10App', [ 
'ngCookies', 
'ngResource', 
'ngSanitize', 
'ui.router', 
'ui.bootstrap', 
'ngStorage', 
'cfp.loadingBar', 
'ngAnimate' 
]) 
.config($stateProvider: ng.ui.IStateProvider, 
      $urlRouterProvider: ng.ui.IUrlRouterProvider, 
      $locationProvider: ng.ILocationProvider) { 
    $urlRouterProvider.otherwise('/'); 
    $locationProvider.html5Mode(true); 
} 

作为控制器，它应该被定义为一类

module controllers { 
    export interface IYourScope extends ng.IScope { 
     someField: boolean; 
     someOtherField: string; 
    } 

    export class yourController { 
     constructor(private $scope: IYourScope) { 
      $scope.someField = true; 
      $scope.someOtherField = "something"; 
     } 
    } 
} 

altough我喜欢更多使用controllerAs和然后访问控制器类的属性（我猜它会导致稍后迁移到Angular 2.0），有些类似于：

module controllers {  
    export class yourController { 

     public someField: boolean; 
     public someOtherField: string; 

     constructor(private $scope: ng.IScope) 
      this.someField = true; 
      this.someOtherField = "something"; 
     } 
    } 
} 

，那么你可以注册这个控制器一如既往

angular.module('yourModule').controller('ctrl',controllers.yourController);