Question

我有一个简单的Nativescript应用程序。

当我更新 model.path 属性时，它已正确设置，并且UI中的Label显示其值。

但是当我在返回的promise的 .then（...）函数中设置 model.path 属性时（ new Promise（...） ）设置属性（ uploadFile（...）方法中的警告显示正确的值），但UI中的Label不再更新。为什么呢？

主page.xml：

<Page xmlns="http://schemas.nativescript.org/tns.xsd" loaded="pageLoaded">
    <StackLayout>
        <Button width="200" height="66" text="Record!" tap="recordVideo"></Button>
        <Label text="{{path}}"></Label>
    </StackLayout>
</Page>

主页-model.ts：

import { Observable }  from 'data/observable';

export class MainPageModel extends Observable {
    private _path: string;

    constructor() {
        super();
    }

    public get path(): string {
        return this._path;
    }

    public set path(value: string) {
        this._path = value;
        super.notify({ object: this, eventName: Observable.propertyChangeEvent, propertyName: "path", value: this._path });
    }
}

主page.ts：

import { VideoRecorder }  from 'nativescript-videorecorder';
import { MainPageModel }  from './main-page-model';
import { EventData } from "data/observable";
import { Page } from "ui/page";

var model: MainPageModel;

export function pageLoaded(args: EventData) {
    let page = <Page>args.object;
    model = new MainPageModel();
    page.bindingContext = model;
}

export function recordVideo() {
    model.set("path", "clieckedd");
    let videorecorder = new VideoRecorder();
    let options = {
        saveToGallery: true, //default false | optional
        duration: 10, //(seconds) default no limit | optional
        size: 10, //(MB) default none | optional #android
        hd: false, //default  false low res | optional
        explanation: "Why do i need this permission" //optional on api 23 #android
    };

    videorecorder.record(options)
    .then((data) => {
        model.set("path", data.file);
        uploadFile(model);
    })
    .catch((err) => {
        console.log(err);
        model.path = err;
    });
}

function uploadFile(model: MainPageModel) {
    alert(model.path);
}

exports.model = model;

谢谢

Answer 1

我想这是因为您使用了Observable的set方法，即model.set("path", data.file); 而不是你的public set path(value: string)。这就是为什么没有调用super.notify因此标签UI没有更新到新值。我认为它应该是model.path(data.file)

在promise.then（）中设置模型时，不会更新视图中的Nativescript - binded属性

1 个答案: