设置 ng.其他文件中的控制器

Setup ng.IModule controller in other files

本文关键字:控制器 文件 ng 其他 设置      更新时间:2023-09-26

>我有以下JavaScript,我想将其转换为TypeScript,但我正在删除:(

.JS

var app = angular.module('app', []);
app.config([...]);
app.run([...];
(function (ng, app) {
  app.controller('appCtrl', [..., function(...)])
})(angular, app);

这就是我目前所得到的。

TS

文件1:

/// <reference path="../Scripts/typings/angularjs/angular.d.ts" />
module App {
    "use strict";
    var mod:ng.IModule = angular.module(name, []);
}

文件2:

/// <reference path="../Scripts/typings/angularjs/angular.d.ts" />
module App {
    'use strict';
    export interface IAppCtrlScope extends ng.IScope {
        greeting: string;
        changeName(name): void;
    }
    export class AppCtrl {
        public static $inject = [
            '$scope'
        ];
        constructor(private $scope: IAppCtrlScope) {
            $scope.greeting = 'asdf';
            $scope.changeName = (name) => {
                $scope.greeting = 'Hello ' + name + ' !';
            }
        }
    }
    mod.controller('appCtrl', AppCtrl); // this doesn't work
}

在定义控制器的文件中执行mod.controller('appCtrl', AppCtrl)的原因是因为它更容易维护。

所以解决方案非常简单。我所要做的就是导出变量。

module Application {
    'use strict';
    export var angularApp: ng.IModule = angular.module("app", []);
}
module Application {
    'use strict';
    export interface IAppCtrlScope extends ng.IScope {
        greeting: string;
        changeName(name): void;
    }
    export class AppCtrl {
        public static $inject = [
            '$scope'
        ];
        constructor(private $scope: IAppCtrlScope) {
            $scope.greeting = 'asdf';
            $scope.changeName = (name) => {
                $scope.greeting = 'Hello ' + name + ' !';
            }
        }
    }
    angularApp.controller('appCtrl', AppCtrl)
}

我会使用一个类作为控制器。有关示例,请参阅 https://youtube.com/watch?v=WdtVn_8K17E&hd=1。