Javascript 无法在使用angularjs的typescript中的方法中使用从构造函数注入的服务

我使用SideWaffle的Angular脚本控制器模板创建了一个Angular控制器

我的HomeController.ts文件如下所示

interface IHomeControllerScope extends ng.IScope {        
    GetEmployee: (id) => ng.IPromise<Model.Employee>;        
}

interface IHomeController {
    Employee: any;
}

class HomeController implements IHomeController {
    static controllerId: string = "HomeController";

    Employee = this.$resource("api/employee/:Id", { Id: '@id' });
    constructor(
        private $scope: IHomeControllerScope,
        private $http: ng.IHttpService,
        private $resource: ng.resource.IResourceService,
        private $log: ng.ILogService,
        private $q: ng.IQService) {
        $scope.GetEmployee = this.GetEmployee;        
    }                
    GetEmployee(id) {            
        var defer = this.$q.defer<Model.Employee>();
        this.Employee.get({ Id: id },
            (result) => {
                this.log.debug(result);
                defer.resolve(result);
            }, (result) => {
                defer.reject(result);
            });
        return defer.promise;
    }            
}

app.controller(HomeController.controllerId, ['$scope', '$http', '$resource', '$log', '$q', ($scope, $http, $resource, $log, $q) =>
    new HomeController($scope, $http, $resource, $log, $q)
]);

如您所见，我正在注入多种服务，如logger、q、http和resource。无论我在构造函数中定义什么，都可以在构造函数中使用。但是当我进入像GetEmployee（id）这样的子方法时。这些服务不再可用。所以，在child方法中，我得到这个$log作为未定义。我不知道这是怎么回事。我的观察是，如果一个方法正在扩展一个类，那么它应该能够访问它的上下文

---

我正在寻找的解决方案是，我应该能够在其他子方法中使用所有注入的服务。

我没有看到您初始化了

log

。您只有

$log

属性。如果在构造函数中使用

$log

初始化

log

，我相信它会起作用。

解决此问题的方法是使用箭头方法将函数分配给范围变量

    interface IHomeControllerScope extends ng.IScope {        
    GetEmployee: (id) => ng.IPromise<Model.Employee>;        
}

interface IHomeController {
    Employee: any;
}

class HomeController implements IHomeController {
    static controllerId: string = "HomeController";

    Employee = this.$resource("api/employee/:Id", { Id: '@id' });
    constructor(
        private $scope: IHomeControllerScope,
        private $http: ng.IHttpService,
        private $resource: ng.resource.IResourceService,
        private $log: ng.ILogService,
        private $q: ng.IQService) {
        **$scope.GetEmployee = () => this.GetEmployee ;**        
    }                
    GetEmployee(id) {            
        var defer = this.$q.defer<Model.Employee>();
        this.Employee.get({ Id: id },
            (result) => {
                this.log.debug(result);
                defer.resolve(result);
            }, (result) => {
                defer.reject(result);
            });
        return defer.promise;
    }            
}

app.controller(HomeController.controllerId, ['$scope', '$http', '$resource', '$log', '$q', ($scope, $http, $resource, $log, $q) =>
    new HomeController($scope, $http, $resource, $log, $q)
]);

接口IHomeControllerScope扩展了ng.isScope{
GetEmployee:（id）=>ng.IPromise；
}
接口控制器{
雇员：任何；
}
类HomeController实现IHomeController{
静态控制器ID:string=“HomeController”；
Employee=this.$resource（“api/Employee/：Id”，{Id:'@Id'}）；
建造师(
私人$scope:IHomeControllerScope，
私有$http:ng.IHttpService，
private$resource:ng.resource.IResourceService，
私有$log:ng.ILogService，
私人$q:ng.IQService）{
**$scope.GetEmployee=（）=>this.GetEmployee；**
}                
GetEmployee（id）{
var defer=this.$q.defer（）；
this.Employee.get（{Id:Id}），
（结果）=>{
this.log.debug（结果）；
延迟、解决（结果）；
}，（结果）=>{
推迟、拒绝（结果）；
});
回报、承诺；
}            
}
app.controller（HomeController.controllerId，['$scope'，'$http'，'$resource'，'$log'，'$q'，（$scope，$http，$resource，$log，$q）=>
新HomeController（$scope、$http、$resource、$log、$q）
]);

---

这将为您的控制器生成所需的语法。

我建议使用

vm

机制定义控制器：@basarat我检查了您的视频。使用虚拟机很好。但我的问题不同。我想，定义vm并不能解决任何问题，它只会给你一个更高的级别。我面临的问题，我想它也会出现在你的应用程序中。如果您在构造函数中注入了$http，并且希望在incr或decr方法中使用，那么它将不可用。我正试图解决这个问题，正如@igorbek所指出的，您的代码中唯一错误的地方就是调用$log变量。我已经尝试过类似的代码，它是有效的。

    interface IHomeControllerScope extends ng.IScope {        
    GetEmployee: (id) => ng.IPromise<Model.Employee>;        
}

interface IHomeController {
    Employee: any;
}

class HomeController implements IHomeController {
    static controllerId: string = "HomeController";

    Employee = this.$resource("api/employee/:Id", { Id: '@id' });
    constructor(
        private $scope: IHomeControllerScope,
        private $http: ng.IHttpService,
        private $resource: ng.resource.IResourceService,
        private $log: ng.ILogService,
        private $q: ng.IQService) {
        **$scope.GetEmployee = () => this.GetEmployee ;**        
    }                
    GetEmployee(id) {            
        var defer = this.$q.defer<Model.Employee>();
        this.Employee.get({ Id: id },
            (result) => {
                this.log.debug(result);
                defer.resolve(result);
            }, (result) => {
                defer.reject(result);
            });
        return defer.promise;
    }            
}

app.controller(HomeController.controllerId, ['$scope', '$http', '$resource', '$log', '$q', ($scope, $http, $resource, $log, $q) =>
    new HomeController($scope, $http, $resource, $log, $q)
]);