对于我正在从事的项目,我发现了一种没有很多意义的情况。我强烈怀疑,当我从事打字稿工作时,我的特殊问题是由于 javascript的有趣细微差别,但我不确定如何证明或修复它。
背景
对于我正在处理的应用程序,我有一项相当基本的服务,负责与Web API进行通信。
唯一与我通常所做的不同的是,我不是使用Typescript的" lambda"语法进行$http.get(...).then(...)
成功回调,而是使用类函数,因为a)我使用的代码实际上是在使用错误回调,b)用lambda语法阅读$http.get(...).then(success, error)
语法有点混乱。
// Not pretty, but sufficient.
this.$http.get(...).then(() => { ... });
// Ewwww...
this.$http.get(...)
.then(() => {
...
}, () => {
...
});
// Much better!
this.$http.get(...)
.then(onFooSuccess, onError);
这是相关服务:
namespace MyApp.Models {
export class WebApiResult<T> {
public data: T;
}
}
namespace MyApp.Services {
export class SomeService {
public status: SomeServiceStatus = new SomeServiceStatus();
public static $inject: string[] = ['$http'];
public constructor(
public $http: ng.IHttpService
) {
}
public doSomething(): ng.IPromise<SomeServiceStatus> {
this.$http.get('/api/some/SomeAction')
.then(this.onDoSomethingSuccess, this.describeError);
}
// This is the problem method. When this code runs,
// a type error is generated.
public onDoSomethingSuccess(result: Models.WebApiResult<SomeServiceStatus>): SomeServiceStatus | ng.IPromise<SomeServiceStatus> {
if(!result.data.isInSpecialState) {
return result.data;
}
// TypeError! Can't assign to undefined.
this.status = result.data;
return result.data;
}
public describeError(error: any) {
alert('oops');
}
}
export class SomeServiceStatus {
public isInSpecialState: boolean = false;
public someStatusMessage: string = '';
public someIdentifier: string = '';
}
angular
.module('app')
.service('someService', SomeService);
}
问题
因此,每当您调用此服务时,$http
GET将成功执行。但是,问题是成功的回调 - 但是 - 当命中行this.status = result.data
时,由于无法将result.data
分配给undefined
的属性status
,因此始终会引发异常。
目前,我的理论是this
实际上不是指SomeService
,而是其他内容,甚至可能是类似的类方法。
问题
该理论导致了一些问题。
-
this
到底是什么?在Visual Studio 2015中对其进行搅拌显示"有用"文本:this: this
。谢谢微软。 -
this
是否应该这样做?这是一个打字稿错误,还是我用生成的JavaScript射击自己的脚? - 处理既有成功又有错误回调的AngularJS Promise时是否有任何建议的风格选择?我可能没有看到编写代码的更好方法,或者我根本不知道。这不是第一次问一个问题教给我一些东西。
这是JavaScript的东西。如果您提供函数实例,或在经典的JavaScript中写入:
..then(function(data) { ...}, function(error) { ... })
然后,与新的lambda表达式不同,javascript行为旧方式," this"设置为这些处理程序的dosomething(){}的范围。
但是bind()可以帮助您保持漂亮的语法完整,并有点冗余:
public doSomething() {
this.$http.get('/api/some/SomeAction')
.then(this.onDoSomethingSuccess.bind(this), this.describeError.bind(this));
}