在函数中从派生类访问基成员答案

【问题标题】：Accessing base member from derived class in function在函数中从派生类访问基成员
【发布时间】：2017-07-07 22:05:16
【问题描述】：

我创建了 Angular2 + Typescript 项目。我有很多表，所以我想要一些类似基本组件的东西。

这是我的基础组件：

export abstract class ManagementComponent<T> implements BaseComponent {

    protected selectedItem: T;

    protected items: Array<T>;

}

现在有我的子组件。我想从 http 获取所有项目，然后将其分配到基类中

export class CompetencesComponent extends ManagementComponent<Competence> implements OnInit {

    thisField: string;

    constructor(private service: CompetencesService) {
        super();

    }

    ngOnInit(): void {
        this.getCompetences();
    }

    private getCompetences() {
        this.service.getCompetences().subscribe(function (competences: Array<Competence>) {
            this.thisField // ok
            this.items  // not ok            
        })
    }
}

知道如何从订阅方法访问基本字段吗？

【问题讨论】：

标签： javascript angular typescript

【解决方案1】：

目前我希望您无法引用thisField 或items，因为您应该会丢失订阅函数中的this 上下文。

你可以切换到箭头函数来保留上下文：

this.service.getCompetences().subscribe((competences: Array<Competence>) => { ... }

【讨论】：

【解决方案2】：

您可以将能力列表设置为父类：

    private getCompetences() {
            var self = this;
            this.service.getCompetences().subscribe(function (competences: Array<Competence>) {
                this.thisField // ok
                self.items =  competences; // not ok          
            })
        }

您无法通过this 绑定访问items 属性的原因是范围。内部回调 this 绑定绑定到其他东西，你失去了上下文。

【讨论】：