Angular2-OnInit訪問功能

Question

我一直遇到與同一組件類中的OnInit訪問函數有關的問題。

我的基本設置如下：

import {Component, OnInit} from '@angular/core';
...
export class AppComponent implements OnInit {

login(){...}

ngOnInit() {

    this.login(); //1

    document.onkeypress = function(e){
        if ( document.body === document.activeElement ) {
            this.login(); //2
        }

    };

1將按預期在頁面加載時觸發登錄功能，但2抱怨登錄不是功能。 如何正確訪問AppComponent中的登錄功能？

Answer 1

這與范圍界定有關。 您呼叫的時間this.login從onkeypress回調this指的是全局對象這樣this.login等於window.login而你的情況是不確定的

可能的解決方案

緩存this

var _this = this;
document.onkeypress = function(e){
    if ( document.body === document.activeElement ) {
        _this.login(); //2
    }

};

用.bind顯式設置上下文

document.onkeypress = function(e){
    if ( document.body === document.activeElement ) {
        this.login(); //2
    }

}.bind(this);

使用ES6箭頭功能()=>{}

document.onkeypress = (e) => {
    if ( document.body === document.activeElement ) {
        this.login(); //2
    }

};