Search code examples
nativescriptnativescript-angular

Need help changing Text of label in TS Code


On my html I have a label that shows a number of amount of images I have submitted to the server for the specific instance. My problem now is that when I upload images it does not refresh the image count, I have to close the Mobile application and open in up again to see image counter going up/.

I have tried to change the variable in the Typescript code after the images are uploaded successfully but the String does not change

<StackLayout class="m-10">
   <Label [text]="imagesCount + ' Photos Uploaded'" verticalAlignment="center" class="lbl-info" horizontalAlignment="center" textWrap="true"></Label>
</StackLayout>
get imagesCount() {
    this._imagesCount = workAttachments.length;

    return this._imagesCount;
}

I expect the Image Label to go from 0 Photos Uploaded to 1 Photos Uploaded

-- Edit --

This is how I upload my images

doFileUpload(file: any) {
        let actualFile = fs.File.fromPath(file);
        let base64 = android.util.Base64.encodeToString(actualFile.readSync(), android.util.Base64.NO_WRAP);
        let workOrderAttachment = new WorkOrderAttachment(new Attachment(base64, file.replace(/^.*[\/]/, ''), 0), WorkOrderAttachmentType.PHOTO, '');

        this._service.workOrderAttachment(this.job.id, workOrderAttachment, ['id']).subscribe(result => {
            if (result == null) {
                UserInterfaceUtil.showError("Error Uploading images.", "");
            } else {
                UserInterfaceUtil.showInfo("Photos uploaded successfully.", "");
                this._imagesCount += 1;
            }
        }, error => {
            UserInterfaceUtil.handleError(error);
            console.log(error);
        });
    }

Solution

  • The only way I could get this done correctly was adding a button on the Form to refresh the Label. It is not the best way of doing what I need, but it is done.