Only 1 argument was provided instead of the expected 2 when attempting to update Firebase through Ionic

I encountered an issue while trying to update Firebase from Ionic. Below is the function I used to update the data.

Below is the TypeScript code:

updateLaporan()
  {
    this.id = this.fire.auth.currentUser.uid;
    this.db.list('/laporan/'+this.id).update({
      mydate : this.mydate.value,
      porsiKarbohidrat : this.porsiKarbohidrat.value,
      porsiProteinHewani : this.porsiProteinHewani.value,
      porsiProteinNabati : this.porsiProteinNabati.value,
      porsiLemak : this.porsiLemak.value,
    })

    this.alert("Data updated successfully")
  }

This is the HTML for editing the data, where I attempted to pass and receive the values in TypeScript using ViewChild:

<ion-content padding>
    <ion-list>
        <ion-datetime displayFormat="MMM DD YY" [(ngModel)]="myDate" #mydate></ion-datetime>

        <ion-item>
          <ion-label floating>Porsi Karbohidrat</ion-label>
          <ion-input type="number" #porsiKarbohidrat></ion-input>
        </ion-item>

        <ion-item>
          <ion-label floating>Porsi Protein Hewani</ion-label>
          <ion-input type="number" #porsiProteinHewani></ion-input>
        </ion-item>

        <ion-item>
          <ion-label floating>Porsi Protein Nabati</ion-label>
          <ion-input type="number" #porsiProteinNabati></ion-input>
        </ion-item>

        <ion-item>
            <ion-label floating>Porsi Lemak</ion-label>
            <ion-input type="number" #porsiLemak></ion-input>
          </ion-item>

  </ion-list>
  <button ion-button full (click)="updateLaporan()">Update</button>
angulartypescriptfirebase

Answer №1

The reason for the issue is that you are attempting to update the object but using this.db.list instead.

updateLaporan()
  {
    this.id = this.fire.auth.currentUser.uid;
    this.db.object('/laporan/'+this.id).update({
      mydate : this.mydate.value,
      porsiKarbohidrat : this.porsiKarbohidrat.value,
      porsiProteinHewani : this.porsiProteinHewani.value,
      porsiProteinNabati : this.porsiProteinNabati.value,
      porsiLemak : this.porsiLemak.value,
    })

    this.alert("Data updated successfully")
  }

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

Can you explain the significance of using square brackets in the typescript enum declaration?

While reviewing a typescript file within an Angular ngrx project titled collection.ts, I came across the declaration of enum constants. import { Action } from '@ngrx/store'; import { Book } from '../models/book'; export enum Collecti ...

angulartypescriptenumsngrxngrx-store

Bring in styles from the API within Angular

My goal is to retrieve styles from an API and dynamically render components based on those styles. import { Component } from '@angular/core'; import { StyleService } from "./style.service"; import { Style } from "./models/style"; @Component({ ...

javascriptcssangularsass

Display full lines of nested tree view HTML lists upon hovering using HTML, CSS, Angular, and Bootstrap

I currently have an Angular 4 application where a left-side div displays a tree of items as recursive HTML lists. The issue I am facing is that long texts within this div get cut off by the right border, with a scrollbar appearing instead. What I would lik ...

htmlcssangularbootstrap-4

Coloring intersected meshes in three.js will recolor every mesh in the scene

My attempt to change the color of a mesh on mouse hover is not functioning as expected. Instead of coloring only one mesh red, every single mesh is being filled with the color. Upon inspecting the intersected objects during debugging, it shows only one el ...

typescriptthree.js

I am looking to dynamically print countries from an array in my code based on the selected option

I'm in need of some simple code assistance. I want to display a list of countries that correspond to a selected letter, but I'm struggling to do so dynamically at the moment. For example, if I select the letter A from a dropdown menu, I want the ...

javascriptangulartypescript

Angular: Dynamically add or delete an interceptor based on conditions

Is it possible to dynamically include or exclude an interceptor based on user selection? For my application, I want to enable Azure AD based SSO using the @azure/msal-angular package https://www.npmjs.com/package/@azure/msal-angular that provides an inter ...

angularazure-ad-msalangular-http-interceptorsmsal-angular

Creating a dynamic union type in Typescript based on the same interface properties

Is it possible to create a union type from siblings of the same interface? For example: interface Foo { values: string[]; defaultValue: string; } function fooo({values, defaultValue}: Foo) {} fooo({values: ['a', 'b'], defaultVal ...

typescripttypesinterface

What steps can be taken to properly set up routing in Angular 4 in a way that organizes feature-modules routes as children in the

Organizational layout of projects: /app app.module.ts app.routing.ts : : /dashboardModule /manage-productModule manage-product.module.ts manage-product.routing.ts Within 'app.routing.ts' [ { path : '&a ...

angularangular-routingangular-module

Angular - Conceal Protected Links on the Template

In my AuthGuard, I have implemented CanActivate which returns either true or false based on custom logic: import { Injectable } from '@angular/core'; import { Router, CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular ...

angulartypescriptrolesangular-routing

What is the process for setting up custom global interfaces in TypeScript using .d.ts files?

I'm currently facing an issue in my ReactJS project using Webpack2 and TypeScript. Everything is functioning perfectly except for one thing - I've been struggling to move my self-written interfaces into separate files so they are accessible throu ...

typescripttypescript-typingstypescript2.0typescript1.8

What's the best approach for revalidating data with mutate in SWR?

Whenever a new album is created in my app, the post request response includes an updated list of all albums. To enhance the user experience, I wanted the newly created content to automatically show up without requiring a page refresh. Although I am famil ...

javascriptreactjstypescriptnext.jsswr

Is it possible to modify the content of an element with a click event in Angular/HTML?

How can I implement a feature in my mat-accordion using mat-expansion-panels where the text becomes underlined when the panels are clicked? I want the title to be underlined when the panels are open and for the underline to disappear when they are closed ...

htmlangulartypescriptangular-material

Enhance user experience with Bootstrap by automatically adding a frame around a card upon clicking

Hello everyone! I am a beginner in the Angular/Web Development world and I am currently working on improving my HTML/CSS skills. While using Bootstrap in my Angular project, I ran into a challenge that I couldn't figure out on my own. I have implement ...

javascripthtmlcssangularbootstrap-5

Tips for accessing a specific value within an array of objects using a key

Is there a way to retrieve the value in an object array based on a key that is present within the same array? The structure of the object array is as follows: const objectArray = [ {key: "1", value: "12321"}, {key: "2", value: "asdfas"} ] For ex ...

arraysangulartypescript

Guide to seamlessly incorporate a HTML template into your Angular 7 project

I'm currently in the process of integrating an HTML template into my Angular 7 project, and unfortunately, it does not seem to be functioning as expected. To start off, I have placed the template files under assets/template/.. and included the necess ...

angulartypescripttemplates

Invoking a function containing an await statement does not pause the execution flow until the corresponding promise is fulfilled

Imagine a situation like this: function process1(): Promise<string> { return new Promise((resolve, reject) => { // do something const response = true; setTimeout(() => { if (response) { resolve("success"); ...

javascripttypescriptasync-await

What could be preventing my file from being uploaded to Firebase's storage using C# .NET?

I have been working on uploading a '.png' file to Firebase's storage using c# .net. Despite everything appearing to run smoothly without errors, the file does not show up in Firebase's storage. Strangely, when I run the code, it doesn&a ...

c#.netfirebasefirebase-storage

Issues with CSS Styling not being applied properly on mobile devices in a React App deployed on Heroku

The Dilemma My React app is deployed on Heroku using create-react-app for bundling. The backend is a Node.js written in Typescript with node version 10.15.3. Locally, when I run the site using npm start, everything works perfectly. However, when I view t ...

cssnode.jsreactjstypescriptheroku

Exploring Substrings in TypeScript strings

Can you pass a partial string (substring) as a value to a function in TypeScript? Is something like this allowed? function transform( str: Substring<'Hello world'> ) { // ... } If I call the function, can I pass a substring of that st ...

typescript

Guide to implementing an enum in an Angular Component

Having a global state (or "mode") in my Angular Components is leading me to look for more efficient ways to code. Here is what I have tried: @Component({ .... }) export class AbcComponent implements OnInit { enum State { init, view, edit, cre ...

angulartypescript