在內部模塊中定義/使用angularjs控制器

Question

我使用Typescript 1.4和angularjs 1.3.6。

使用VS 2015年RC與webessentials，沒有模塊系統（無--module標誌）

我有一個工作這樣的代碼：

demoModule.ts

module Demo.Test { 
'use strict'; 


(() => { 
    var app = angular.module('Demo.Test', []); 


    // Routes. 
    app.config([ 
     '$stateProvider', $stateProvider => { 

      $stateProvider 
       .state('demo', { 
       url: '/demo', 
       templateUrl: '/views/test/demo.html', 
       controller: 'demoController as vm' 
      }); 
     } 
    ]); 
})(); 

demoController.ts

module Demo.Test { 
    'use strict'; 
    export class DemoController { 
     constructor(/* ... */) { /* ... */} 
    } 
    angular.module('Demo.Test').controller('demoController', Demo.Test.DemoController); 
} 

但是，當我提出這個行：

angular.module('Demo.Test').controller('demoController', Demo.Test.DemoController); 

到demoModule.ts文件（見下文），它會編譯，但在運行時得到JS錯誤：

Error: [ng:areq] Argument 'demoController' is not a function, got undefined

任何想法，我怎樣才能使它工作？我的意思是這樣的：

module Demo.Test { 
'use strict'; 


(() => { 
    var app = angular.module('Demo.Test', []); 
    angular.module('Demo.Test').controller('demoController', Demo.Test.DemoController); 

    // Routes. 
    app.config([ 
     '$stateProvider', $stateProvider => { 

      $stateProvider 
       .state('demo', { 
       url: '/demo', 
       templateUrl: '/views/test/demo.html', 
       controller: 'demoController as vm' 
      }); 
     } 
    ]); 
})(); 

Answer 1

它與文件的排序有關。在TypeScript中使用--out造成的衆所周知的錯誤之一：https://github.com/TypeStrong/atom-typescript/blob/master/docs/out.md#runtime-errors

Answer 2

如果您使用腳本引用的順序不正確，那麼您將得到運行時錯誤。
as：Error：[ng：areq]參數'demoController'不是函數，但未定義

在demoModule.ts之前在您的html文件中添加demoController.ts。

<script src="demoController.js"></script> 
<script src="demoModule.js"></script>