Share images and additional data in Nativescript using TypeScript and Angular without the need for FormData

I gave this a try but unfortunately Send FormData with other field in Angular didn't work for me.

I'm looking to retrieve an image from the file system and then send it.

let fullPath = path.join(folder.path, "1.png");
const imageFromLocalFile: ImageSource = <ImageSource> fromFile(fullPath);
const base64String = imageFromLocalFile.toBase64String("png");

Answer â„–1

Unfortunately, FormData is not supported in NativeScript. However, there are two alternative options you can consider:

  1. You can send the image as a Base64 string. It seems like you are already familiar with obtaining the Base64 string from the image. Simply include it as a parameter in the JSON body.
  2. Another option is to use the nativescript-background-http plugin, which allows for direct file uploads.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Setting up gulp-typescript to integrate seamlessly with JSPM while transpiling Angular2 TypeScript involves a few key steps

Here is an example of our gulp script that handles transpiling TypeScript: const gulp = require('gulp'); const typescript = require('gulp-typescript'); const sourcemaps = require('gulp-sourcemaps'); const tscConfig = require( ...

Encountering a Problem with HTTP Requests in Angular 2

Seeking assistance with a technical issue. My objective: Make a REST API call to retrieve JSON data and resolve an Angular 2 promise. ServerAPI built with Node.js/ExpressJS/Lodash Sample of server.js file: var express = require('express'); va ...

Feeling overwhelmed by the potential capabilities of Angular Firestore

Seeking clarification as I am struggling to understand the usage of Angular and Firestore. Recently delved into Google Firebase and attempted CRUD operations with Firestore. What sets apart this library from others? import { Firestore } from '@angul ...

Tips on ending an interval in rxjs once it has started

Implemented a code in an Angular component to retrieve data from a service every 10 seconds on initialization. Now, I need to find a way to stop the interval after a certain period of time such as 5 minutes or when all the necessary data has been collected ...

Steps to activate a function within an angular6 form-related directive

Is there a way to execute a function within a directive when the form is marked as pristine? I want to apply a CSS class to a tab header when the form is pristine. <form [formGroup]="awayForm" (ngSubmit)="onSubmit()" awayConfirm [cancelClicked]="cancel ...

Display a message stating "No data available" using HighCharts Angular when the data series is empty

My Angular app utilizes Highchart for data visualization. One of the requirements is to display a message within the Highchart if the API returns an empty data set. I attempted a solution, but unfortunately, the message does not appear in the Highchart a ...

Utilizing Angular Material's <mat-selection-list> and <mat-list-option> components seamlessly between different sections of a template

How can a <mat-list-option> declared in component sub subscribe to a <mat-selection-list> outside of component sub (for example, in component app)? (Unfortunately, I couldn't get Stackblitz to work due to my corporate's proxy restric ...

What is the best way to trigger a code block once an observable in Angular has completed all of its tasks?

I have an observable made from an array of form controls in Angular. I am using dropdowns and inputs to calculate the sum of all currencies in relation to one currency, and it works. However, my issue is that when I want to update the field itself, the v ...

Getting the parent from a child in Typescript: Best Practices

Querying: In TypeScript, is it possible to retrieve a parent instance from a child instance? I am aware that casting a child into its parent is a method, however, the child's additional properties still exist in the parent, albeit concealed. Check o ...

Having difficulty initializing the local server for an Angular 7 website

I've just started delving into Angular and have been assigned to update an older company project that was built with Angular 7 to version 18. The catch is, the project won't even launch in its current state. Despite running npm install and npm st ...

Is there a way to enhance the readability of intellisense output for Typescript generics using the Omit method?

Scenario: I have customized a third-party library for users by removing two properties from all functions in the library. I have implemented a function to achieve this, along with executing a bootstrap function if provided. Here is the code snippet: const ...

The value returned by elementRef.current?.clientHeight is not the correct height of the element

I've encountered a peculiar issue with my code where the reported height of an element does not match its actual size. The element is supposed to be 1465px tall, but it's showing up as 870px. I suspect that this discrepancy might be due to paddin ...

Angular API for search filtering input

I am currently retrieving data from an API in my service. I now need to implement a search filter by name. Here is the code for the Service: export class ListService { listUrl = 'https://swapi.co/api/planets'; constructor(private ht ...

Monitoring modifications in elements within an array using Angular2

Currently using Angular 2 and typescript, I have an array in which I am utilizing DoCheck and IterableDiffer to monitor any changes. While I receive notifications when the array itself is modified, I do not get notified if a property within one of the obje ...

The ambiguity surrounding the timing of decorator invocation in TypeScript

My understanding was that decorators in TypeScript are invoked after the constructor of a class. However, I recently learned otherwise. For example, the primary response on this thread suggests that Decorators are called when the class is declared—not wh ...

Troubleshooting the malfunction of the Angular 2 Tour of Heroes project following the separation of the app

Recently, I encountered a challenge while following a tutorial on learning Angular 2. Everything was going smoothly until I reached the point where I had to divide appcomponent into heroescomponent & appcomponent. Is there anyone else who has faced th ...

Emphasize the interactions within the table cells based on their corresponding column and row

I'm looking to achieve a specific interaction in my Angular Material table. I want to highlight the table cell interactions with column and row by extending the highlighting up to the column header and left to the row header. Is this something that ca ...

Steps to retrieve a date from a form control

html <form [formGroup]="searchForm" (ngSubmit)="search()"> <div class="row"> <div class="col"> <input type="date" class="form-control" formControlName="startD ...

Make sure to call super.onDestroy() in the child component before overriding it

I find myself with a collection of components that share similar lifecycle logic, so I decided to create a base component that implements the OnDestroy interface. abstract class BaseComponent implements OnDestroy { subscriptions = new Array<Subscript ...

The TypeScript error message states, "The property 'value' is not found on 'EventTarget'."

When working with TypeScript and React, I encountered an error in the following code snippet: Property 'value' does not exist on type 'EventTarget'. import React, { Component } from 'react'; class InputForm extends React ...