鉴于这段代码:
module movieApp {
export interface IHomeControllerScope extends ng.IScope {
moviesToDownload: string[];
active: string;
deleteMovieFromDownloadList(movie: any);
markMovieAsDownloaded(movie: any);
}
export class HomeController {
public static $inject = [
'$scope',
'$location',
'MovieService'
];
constructor(private $scope: IHomeControllerScope, private $location: ng.ILocationService, private MovieService) {
this.$scope.$on('$locationChangeSuccess', (event) => {
this.setActiveUrlPart();
});
MovieService.getMoviesToDownload().then(response => {
this.$scope.moviesToDownload = response;
});
}
private setActiveUrlPart() {
var parts = this.$location.path().split('/');
this.$scope.active = parts[1];
}
public get moviesToDownload() {
return this.$scope.moviesToDownload;
}
public markMovieAsDownloaded(movie: any) {
movie.Downloaded = true;
}
public deleteMovieFromDownloadList(movie: any) {
this.MovieService.deleteMovieFromDownloadList(movie).then(() => {
debugger;
this.$scope.moviesToDownload = _.without(this.$scope.moviesToDownload, movie);
});
}
}
}
app.controller("HomeController", movieApp.HomeController);
一切正常,但在行中的deleteMovieFromDownloadList方法.$scope.moviesToDownload = _.without(this.$scope.moviesToDownload,movie);,这是指窗口对象,而不是我期望的实际对象.
生成的JavaScript如下所示:
var movieApp;
(function (movieApp) {
var HomeController = (function () {
function HomeController($scope, $location, MovieService) {
var _this = this;
this.$scope = $scope;
this.$location = $location;
this.MovieService = MovieService;
this.$scope.$on('$locationChangeSuccess', function (event) {
_this.setActiveUrlPart();
});
MovieService.getMoviesToDownload().then(function (response) {
_this.$scope.moviesToDownload = response;
});
}
HomeController.prototype.setActiveUrlPart = function () {
var parts = this.$location.path().split('/');
this.$scope.active = parts[1];
};
Object.defineProperty(HomeController.prototype, "moviesToDownload", {
get: function () {
return this.$scope.moviesToDownload;
},
enumerable: true,
configurable: true
});
HomeController.prototype.markMovieAsDownloaded = function (movie) {
movie.Downloaded = true;
};
HomeController.prototype.deleteMovieFromDownloadList = function (movie) {
var _this = this;
this.MovieService.deleteMovieFromDownloadList(movie).then(function () {
debugger;
_this.$scope.moviesToDownload = _.without(_this.$scope.moviesToDownload, movie);
});
};
HomeController.$inject = [
'$scope',
'$location',
'MovieService'
];
return HomeController;
})();
movieApp.HomeController = HomeController;
})(movieApp || (movieApp = {}));
app.controller("HomeController", movieApp.HomeController);
//# sourceMappingURL=HomeController.js.map
如您所见,在生成的JS中,特定方法使用_this.这看起来是对的,对吗?
有人可以向我解释发生了什么以及如何解决这个问题?
编辑:
我将它与Angular结合使用:
<body data-ng-app="movieApp" data-ng-controller="HomeController as homeCtrl">
<div class="col-sm-1">
<i class="fa fa-trash-o" data-ng-click="homeCtrl.deleteMovieFromDownloadList(m)" title="Verwijder uit lijst"></i>
</div>
</body>
编辑二:
在尝试了所有的建议,然后设置回我在这里发布的原始代码之后,一切正常!我不知道如何,但我想这与Chrome / VS 2013有关.无论如何,感谢那些试图帮助我的人.
解决方法:
可能“deleteMovie …”函数绑定到按钮或其他UI元素.在这种情况下,此函数在窗口上下文中执行.要解决此问题,您应该在控制器的构造函数中定义函数体:
constructor(private $scope: IHomeControllerScope, private $location: ng.ILocationService, private MovieService) {
// other initialization code...
this.deleteMovieFromDownloadList = (movie: any) => {
this.MovieService.deleteMovieFromDownloadList(movie).then(() => {
debugger;
this.$scope.moviesToDownload = _.without(this.$scope.moviesToDownload, movie);
});
}
}
并在您的控制器类中声明适当的函数:
deleteMovieFromDownloadList: (movie: any) => void;
原文地址:https://codeday.me/bug/20190830/1766388.html
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。