AngularJS - 指令 - onClick 函数调用 $http(POST) - $http未定义?

Question

>我有一个AngularJS指令，它使用$http(ng.IHttpService)没有问题。

我将"click"事件绑定到一个函数，并希望在同一个 api 控制器上调用 POST 请求以将一些数据放入数据库中。

这是指令

import { Advert } from "../entities";
interface AdvertScope extends ng.IScope {
advert: Advert;
}
export class AdvertDirective implements ng.IDirective {    
restrict = 'EA';
templateUrl = '/AngularViews/adverts.html';
scope = {}
constructor(private $http: ng.IHttpService) { }
public link = (scope: AdvertScope, elem: JQuery, attributes: ng.IAttributes, ngModel: ng.INgModelController) => {
this.$http.get<Advert>('/api/adverts/get-adverts')
.then(response => {
scope.advert = response.data;
});
elem.bind('click', function (e: any): void {
var advertId = e.path[0].id;
if (advertId != null && advertId != undefined) {
var data = { advertId: advertId };
// This is just a fire-and-forget post - no success/error handling   
this.$http.post('/api/adverts/log-click', JSON.stringify(data));
}
});        
}
static factory(): ng.IDirectiveFactory {
var directive = ($http: ng.IHttpService) => new AdvertDirective($http);
directive.$inject = ['$http']
return directive;
}
}

问题是，当点击事件被击中时，错误：

未

捕获的类型错误：无法读取未定义的属性"post">

生成。

Answer 1

当你写"函数"时，所以"this"指的是函数本身。 你只需要用这样的() =>{}替换"函数"：

elem.bind('click',  (e: any): void=> {
var advertId = e.path[0].id;
if (advertId != null && advertId != undefined) {
var data = { advertId: advertId };
// This is just a fire-and-forget post - no success/error handling   
this.$http.post('/api/adverts/log-click', JSON.stringify(data));
}
});