CODEWITHSUNDEEP
typescriptionic-framework
user3277804
user3277804

Reputation: 53

property does not exist on object on ionic typescript

I'm trying to create a todo object with members' username and password to hold data brought in by ngmodel. However, I have not been able to declare this object successfully. I tried using arrow notation on the logForm function to bring in this, but it doesn't seem to work. I think what is happening is the todo object is not being properly declared.

import { Component, OnInit } from '@angular/core';

import {BackendDataService} from '../../backend-data.service';

import { map } from 'rxjs/operators';

import { Router } from '@angular/router';

import {LocalStorageService} from '../../local-storage.service';


@Component({
  selector: 'app-loginform',
  templateUrl: './loginform.component.html',
  styleUrls: ['./loginform.component.scss'],
})
export class LoginformComponent implements OnInit {



  
  username: string;

  password: string;
  
  todo: Todo;

  /*
  todo = {

  }
  */


  constructor(private backendDataService: BackendDataService, private router: Router, private storage: LocalStorageService) { 
  //constructor = (private backendDataService: BackendDataService, private router: Router, private storage: LocalStorageService) => {
  
    this.todo = new Todo();
    
    
  
  
  }

  ngOnInit() {

  }
  


  

  
  





  //logForm() {
  logForm = () => {


    var obv;



    //var username;
    //var password;
    let username = "";
    let password = "";

    username = this.todo.username; //<<<<ERROR Property 'username' does not exist on type '{}'.
    password = this.todo.password;

    console.log("username: " + username);
    console.log("password: " + password);




    this.storage.set("username", username);
    this.storage.set("password", password);

    obv = this.backendDataService.postLogin(username, password);

    obv.pipe(map( res => res)).subscribe(data => {

        console.log( data.response);

        console.log("isAuthenticated: " + data.isAuthenticated);

        if (data.isAuthenticated == true)
        {
          console.log("response was successful");


            this.router.navigateByUrl('/home');
            //this.router.navigate(['/home']);

        }

        //console.log(data);

        //console.log(data.balance);

        //this.balance = data.balance;

        //this.name = "elephant";

        //this.bitcoinAddress = data.bitcoinAddress;

    });

    

    
  }

}


class Todo
{

  username: string;

  password: string;
  
  test() {
  
    console.log("TEST RAN<<<<");
  
  }


}

Upvotes: 0

Views: 202

Answers (2)

Hassan Ali
Hassan Ali

Reputation: 1029

you no need to do this.

this.todo = new Todo();

you can directly use in HTML file

<input [(ngModel)]="todo.username" />
<input [(ngModel)]="todo.password" />

you can direct you TS Without initialize object.

console.log("username: " + this.todo.username);
console.log("password: " + this.todo.password);




this.storage.set("username", this.todo.username);
this.storage.set("password", this.todo.password);

no need this kind of code.

let username = "";
let password = "";

username = this.todo.username; //<<<<ERROR Property 'username' does not exist on type '{}'.
password = this.todo.password;

the last point, no need to use here arrow function use a simple function like

loginForm(){
  // code here
}

Upvotes: 1

Janitha Rasanga
Janitha Rasanga

Reputation: 1126

Try this.

Romove this first. todo: Todo;

Then declare todo like this.

todo = {
 username: '',
 password: ''
}

Try without using Todo class.

Upvotes: 0

Related Questions