Please Help: TypeError can't assign to property

Sorry to bother you, but I really need help :frowning: i can’t figure out how to make this submit correctly :frowning:

Whenever I hit the submit button, it says:
ERROR TypeError: “can’t assign to property “username” on “Bob Jones”: not an object”
onSignup signup.ts:37
View_SignupPage_0 SignupPage.html:72

I don’t understand why it won’t let me set Bob Jones to “fullName” or how to do it :frowning:

here is my signup.html:

<ion-header>
  <ion-toolbar>
    <ion-buttons slot="start">
      <ion-menu-button></ion-menu-button>
    </ion-buttons>
    <ion-title>Sign-Up</ion-title>
  </ion-toolbar>
</ion-header>

<ion-content>

  <div class="signup-logo">
    <img src="assets/img/officialLogo.jpg" alt="Ionic Logo">
  </div>

  <form #signupForm="ngForm" novalidate>
    <ion-list lines>
      <ion-item class = "backColor">
        <ion-label position="stacked" color="primary">Full Name</ion-label>
        <ion-input [(ngModel)]="signUpAll.fullName" name="fullName" type="text" #fullName="ngModel">
        </ion-input>
      </ion-item >
     
      <ion-item class = "backColor">
        <ion-label position="stacked" color="primary">E-mail</ion-label>
        <ion-input [(ngModel)]="signUpAll.email" name="email" type="text" #email="ngModel">
        </ion-input>
      </ion-item>
     
      <ion-item class = "backColor">
        <ion-label position="stacked" color="primary">Phone Number</ion-label>
        <ion-input [(ngModel)]="signUpAll.phoneNumber" name="phoneNumber" type="text" #phoneNumber="ngModel">
        </ion-input>
      </ion-item>
    </ion-list>
    
    
      <p class="ion-padding-start ion-padding-end alignText" color="primary">
        Receive Text Message and E-mail Updates About Freedom Church?
      </p>
 <div class="alignText">
      <ion-checkbox name="text" checked="true" color="dark"></ion-checkbox>
    
      <ion-label class="ion-padding-start ion-padding-end">Text Messages </ion-label>
   
      <ion-checkbox name="text" checked="true" color="dark"></ion-checkbox>
  
      <ion-label class="ion-padding-start ion-padding-end">E-Mails </ion-label>
    </div>
      
    <div class="ion-padding">
      <ion-button (click)="onSignup(signupForm)" type="submit" expand="block">Create</ion-button>
    </div>
  </form>

</ion-content>

here is my signup.ts:

import { Component } from '@angular/core';
import { NgForm } from '@angular/forms';
import { Router } from '@angular/router';

import { UserData } from '../../providers/user-data';
import Parse from 'parse'


@Component({
  selector: 'page-signup',
  templateUrl: 'signup.html',
  styleUrls: ['./signup.scss'],
})
export class SignupPage {
  signUpAll = {fullName:'', phoneNumber:'', email:''}
  password: string;
  username: string;
  isSigningup: boolean;
  submitted = false;
  
  
  

  constructor(
    public router: Router,
    public userData: UserData
  ) {}

  onSignup(form: NgForm) {
    this.password = "hiMe1235"
    this.username = "hello12345"
    this.submitted = true;
   
    Parse.User.signUp(this.password, this.username, this.signUpAll.fullName, this.signUpAll.phoneNumber, this.signUpAll.email).then((resp) => {
      console.log('Logged in successfully', resp);
    }, err => {
      console.log('Error signing in', err);
    });

    if (form.valid) {
    
     
    }
  }
}

please help if you can, sorry to bother.

Don’t mix [(ngModel)] binding with ngForm. Either use template-driven forms or reactive forms, but pick a lane and stay in it. You never want two sets of bindings fighting over control of a single anything, be it in the template or in the controller.

Thank you so much for your reply! I took away ngModel and the error went away, but it still didn’t work. Then I took away the form and kept the ngModel and it still didn’t work lol. But them i read the links you put and realized it was a little more complicated than i thought. What worked in the end was using the ionic conference app’s login page. I added the needed variables to the “user-options.ts” page, and then followed suite and added them to the login page as well. The reason nothing was working was because i was overlooking the “user-options.ts” page :frowning:

Also, back4apps i was using could only assign username and passwords and you couldn’t send anything else. If you want to send different information, please use this back4apps tutorial:https://www.back4app.com/docs/platform/get-started/crud-object

Hope this helps someone!