圖像選擇器函數中的本機綁定值

Question

我正在使用圖像選擇器插件。 我可以打開圖像庫並選擇單個或多個圖像。

我的問題是如何將圖像的路徑綁定到xml圖像src？ 在getImage（）函數中不起作用。

xml：

<Image class="imageSource" src="{{ thumb }}" stretch="none" />

打字稿：

import { Observable } from 'data/observable';
import * as imagepicker from "nativescript-imagepicker";

var counter = 0;
var fs = require('file-system');

export class AssistenceViewModel extends Observable {

    thumb:any;

public addImage(){
    dialogs.action({
        message: "Opções", 
        cancelButtonText: "Cancelar", 
        actions: ["Câmera", "Galeria"]
    }).then(result => {

        console.log("Dialog result: " + result);
        if(result == "Câmera"){

            //Do action1
            console.log("Abrir camera");

        }else if(result == "Galeria"){

            console.log("Abrir galeria");
            let context = imagepicker.create({
                mode: "single"
            });

            context.authorize().then(function() {
                return context.present();
            }).then(function(selection) {

                selection.forEach(function(selected){

                    selected.getImage().then(function(imagesource){

                        var localPath = null;

                        if(platformModule.device.os === "Android"){
                            localPath = selected.android;
                            console.log("localPath android: " +localPath);
                        }else {
                            // selected_item.ios for iOS is PHAsset and not path - so we are creating own path
                            let folder = fs.knownFolders.documents();
                            let path = fs.path.join(folder.path, "Test" + counter + ".png");
                            let saved = imagesource.saveToFile(path, "png");

                            localPath = path;
                            console.log("localPath iOS: " +localPath);
                        }

                        if(localPath){
                            this.thumb = localPath  // this is not working
                            console.log("thumb: "+this.thumb); // this is not working
                        }

                    });

                });                 

            }).catch(function(e) {
                console.log(e);
            });
        }
    });
  }
}

console.log（“ localPath android：” + localPath）;的結果

localPath android: /storage/emulated/0/DCIM/Camera/IMG_20171213_224917038.jpg

但我無法獲得有關this.thumb的任何日志。

Answer 1

您應該使用TS箭頭函數保留“緩存此內容的含義”的上下文

例如，對於箭頭功能//在此行上方有更多代碼

.then(() => {
                return context.present();
            }).then((selection) => {

                selection.forEach((selected) => {

                    selected.getImage().then((imagesource) => {

或者that = this; 圖案

var that = this;
// ... your code in the promises follows
that.thumb = newValue;