Angular2 Zugriff Bindungsinstanzvariable innerhalb Rückrufs

Question

In angular2 habe ich die folgende Komponente:

import { Component } from '@angular/core'; 

const dialog = require("electron").dialog; 
const xml2js = require('xml2js'); 
const fs = require("fs"); 
const ipc = require('electron').ipcRenderer; 

@Component({ 
    selector: 'ct-config-editor', 
    templateUrl: 'config.editor.component.html' 
}) 
export class ConfigEditorComponent { 

    constructor() { 
    this.selected_file = 'Max'; 
    } 


    clicked(event){ 
    alert("lol"); 
     ipc.send('open-file-dialog'); 

     ipc.on('selected-directory', function (event, path) { 
     this.selected_file = `You selected: ${path}`; 
     }); 
    } 
} 

Die Ansicht hat eine richtig gebundene Eigenschaft selected_file wie folgt aufgerufen:

<h1>{{selected_file}}</h1> 

Der Wert des H1 ist max am Anfang - aber nachdem mein Callback läuft, habe ich keinen Zugriff auf die this.selected_file, weil der Kontext des 'Dies' nicht meine Klasse ist.

Wie greife ich auf meine Instanzvariable innerhalb des Callbacks zu?

Answer 1

Mit den Pfeilfunktionskontext behalten:

ipc.on('selected-directory', (event, path) => { 
    this.selected_file = `You selected: ${path}`; 
}); 

Auf diese Weise this wird hier

Siehe auch weitere Details

• https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Functions/Arrow_functions#No_binding_of_this