將我的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);