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

Question

我使用Typescript 1.4和angularjs 1.3.6。

使用帶有webessentials的VS 2015 RC，沒有模塊系統（沒有 - 模塊標志）

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

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錯誤：

錯誤：[ng：areq]參數'demoController'不是函數，未定義

任何想法我怎么能讓它工作？ 我的意思是這樣的：

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

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

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

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

Answer 2

它與文件的訂購有關。 在TypeScript中使用--out引起的一個眾所周知的錯誤： https ： //github.com/TypeStrong/atom-typescript/blob/master/docs/out.md#runtime-errors