ERROR TypeError: this.user.setPassword is not a function in angular 5 ?

typeerror is not a function typescript
typeerror is not a function javascript
typeerror is not a function angular
uncaught typeerror is not a function javascript
typeerror is not a function node js
uncaught typeerror $ is not a function wordpress
typeerror is not a function react
how to fix is not a function javascript

Working with a simple angular5 app in front end , i want to do the edit of profil when the users wants to, so i have a button setting related to component ParametresComponent .

What i do first is show the user information with function get UserInfo() , after that when the user finish modifiying his account , he can save the changes , (he can change only 'Tel' and 'password') .

So i have a class Model User.ts :

export class  User{

  id:number;
  username:string;
  password:string;
  prenom:string;
  nom:string;
  tel:string;
  cin:string ;

  setId(value: number) {
    this.id = value;
  }

  setUsername(value: string) {
    this.username = value;
  }

  setPassword(value: string) {
    this.password = value;
  }

  setPrenom(value: string) {
    this.prenom = value;
  }

  setNom(value: string) {
    this.nom = value;
  }

  setTel(value: string) {
    this.tel = value;
  }

  setCin(value: string) {
    this.cin = value;
  }



}

The parametreComponent.component.ts

import { Component, OnInit } from '@angular/core';
    import * as _swal from 'sweetalert';
    import { SweetAlert } from 'sweetalert/typings/core';
    import {AbstractControl, FormBuilder, FormGroup, Validators} from '@angular/forms';
    import {ActivatedRoute, Router} from '@angular/router';
    import {User} from '../Admin/Models/User';
    import {Devloppeur} from '../Admin/Models/Devloppeur';
    import {DevloppeurService} from '../../../service/devloppeur.service';
    import {ClientService} from '../../../service/client.service';
    import {AuthenticationService} from '../../../service/authentication.service';
    const swal: SweetAlert = _swal as any;

    function passwordMatch(control: AbstractControl):{[key: string]: boolean}{

      const password = control.get('password');
      const Confirmationpassword = control.get('Confirmationpassword');

      if( !password || !Confirmationpassword) {
        return null; }

      if(password.value === Confirmationpassword.value){
        return null;
      }

      return {
        mismatch:true
      }

    }

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

      form: FormGroup;
      user:User  = new User();
      id:number;
      constructor(private formBuilder: FormBuilder,
                  public router:Router,
                  private authService:AuthenticationService,
                  public activatedRoute:ActivatedRoute,
                  private devService:DevloppeurService,
                  private clientServ:ClientService) { }

      ngOnInit() {
        this.id = this.authService.getAuthenticatedUserId();
        this.getUserInfo();

        this.form = this.formBuilder.group({
          prenom: [''] ,
          nom: [''],
          tel: ['', Validators.required],
          cin: [''],
          username : [''],
          passwordG: this.formBuilder.group({
            password: ['',[Validators.required,Validators.minLength(9)]],
            Confirmationpassword : ['',[Validators.required,Validators.minLength(9)]]

          }, {validator: passwordMatch})

        });
      }

      getUserInfo(){
        this.clientServ.getUser(this.id)
          .subscribe((data:any)=>{
            this.user = data;
          },err=>{
            console.log('there is an error lady ! ');
          })

      }


      SaveEditUser(){
        this.user.setPassword(this.form.value.passwordG.password);
        this.user.setTel(this.form.value.tel);


        this.devService.saveUser(this.user)
          .subscribe((data:User)=>{
            swal("operation réussi !", "Great edited with success !", "success");
            this.router.navigate([ '/profil' ], { relativeTo: this.activatedRoute });
          },err=>{
            console.log(err);
          })
      }


    }

And the parametres.Component.html :

<div >
  <div class="col-sm-10">
    <div class="card">
      <div class="card-header">
        <strong>Modifier mon profil</strong>
      </div>

      <form [formGroup]="form" (ngSubmit)="SaveEditUser()">

        <div class="card-body">
          <div class="form-group">
            <label for="company">Prenom</label>
            <input type="text" class="form-control" id="company" disabled [(ngModel)]="user.prenom"  formControlName="prenom"/>
          </div>
          <div class="form-group">
            <label for="vat">Nom</label>
            <input type="text" class="form-control" id="vat"  disabled [(ngModel)]="user.nom"   formControlName="nom" />
          </div>
          <div class="form-group">
            <label for="vat">Tel</label>
            <input type="number" class="form-control" id="vat"  [(ngModel)]="user.tel"  formControlName="tel" />
          </div>
          <div class="form-group">
            <label for="vat">Cin</label>
            <input type="text" class="form-control" id="vat"   disabled [(ngModel)]="user.cin"  formControlName="cin" />
          </div>
          <div class="form-group">
            <label for="vat">Email</label>
            <input type="text" class="form-control" id="vat"   disabled [(ngModel)]="user.username"  formControlName="username" />
            <div class="error" *ngIf="form.controls['username'].invalid && form.controls['username'].errors.required && (form.controls['username'].dirty || form.controls['username'].touched)">Please enter an email</div>
            <div class="error" *ngIf="form.controls['username'].invalid && form.controls['username'].errors.email && (form.controls['username'].dirty || form.controls['username'].touched)">Please enter a valid email</div>
            <div class="error" *ngIf="form.controls['username'].invalid && form.controls['username'].errors.emailTaken">This email has been taken, please use another one.</div>
          </div>


          <div formGroupName = "passwordG">

            <div class="form-group">
              <label for="vat">Password</label>
              <input type="password" class="form-control" id="vat"    formControlName="password" />
            </div>

            <div class="form-group">
              <label for="vat">Confirmation Password</label>
              <input type="password" class="form-control" id="vat" formControlName="Confirmationpassword" />
            </div>


            <div *ngIf="(form.controls['passwordG'].invalid && form.controls['passwordG'].touched)" class="col-sm-3 text-danger">

              <ng-container *ngIf="form.controls['passwordG'].errors?.mismatch;
                then first else second"> </ng-container>

              <ng-template #first>
                Password do not match </ng-template>

              <ng-template #second>
                Password needs to be more than 8 characters
              </ng-template>
            </div>

          </div>

        </div>
        <div class="card-footer">
          <button type="submit" class="btn btn-sm btn-primary" [disabled] = "!form.valid"><i class="fa fa-dot-circle-o"></i>Enregistrer Les modifications</button>
        </div>
      </form>
    </div>
  </div><!--/.col-->
</div>

The problem is when saving i get this error :

ParametresComponent.html:8 ERROR TypeError: this.user.setPassword is not a function
    at ParametresComponent.SaveEditUser (parametres.component.ts:79)
    at Object.eval [as handleEvent] (ParametresComponent.html:8)
    at handleEvent (core.js:13530)
    at callWithDebugContext (core.js:15039)
    at Object.debugHandleEvent [as handleEvent] (core.js:14626)
    at dispatchEvent (core.js:9945)
    at eval (core.js:12284)
    at SafeSubscriber.schedulerFn [as _next] (core.js)

i'm not able to understand why i'm getting this error ? any idea ?


Try setting the access specifier as public for all your methods,

public setPassword(value: string) {
    this.password = value;
}

TypeError: "x" is not a function, ERROR TypeError: this.user.setPassword is not a function in angular 5 ? - angular. ERROR TypeError: html2canvas_1.default is not a function This happened after upgrading Angular cli@1.6.8 from 1.5.0. I assume it might be because there was a TypeScript Update?


I have two suggestions: 1) Try to add a constructor in User. 2) In getUserInfo() try to save the object as a User type

getUserInfo(){
        this.clientServ.getUser(this.id)
          .subscribe((data:any)=>{
            this.user = data; // <-- this.user = data as User;
          },err=>{
            console.log('there is an error lady ! ');
          })
      }

Uncaught TypeError: this.validate is not a function · Issue #361 , The JavaScript exception "is not a function" occurs when there was an attempt to call a TypeError: Object doesn't support property or method {x} (Edge) TypeError: "x" is not a function Use a different property name instead: var sixteen = 2 * (3 + 5); alert('2 x (3 + 5) is ' + String(sixteen)); //2 x (3 + 5) is 16  This setup worked for me with Angular 5.1.1, Angular CLI 1.6, angular-handsontable 1.0.0-beta3.. I removed the zone.js import in polyfills.ts file and imported it into main.ts file like this:


You are assigning an object that you have gotten from your API to your this.user object. This means that your new user object is no longer of the type User as you can't pass methods on an object your receive from an API. If you wish to assign the object from the API to your this.user, you have to keep the original this.user which has called new User (thus creating the methods on the object's prototype). To do this, you should assign the properties of the API object rather than the object itself:

getUserInfo(){
  this.clientServ.getUser(this.id)
    .subscribe((data:any)=>{
      Object.assign(this.user, data);
    },err=>{
      console.log('there is an error lady ! ');
    });
}

Nodejs, When trying to register a user with Parse 1.9.2 and passing along some optional attributes, I get parse-1.9.2.js:4986 Uncaught TypeError: this.validate is not a function. Closed. datatypevoid opened this issue on Oct 22, 2016 · 5 comments​. Closed If the registration promise fails registration.fail(function(error) { // . . . }); };. This is a common JavaScript error that happens when you try to call a function before it is defined. You get "'undefined' is not a function" error when you try to


48 answers on StackOverflow to the most popular Angular questions, If you use passport-local-mongoose this module will auto-generate salt and hash You will not have a field for the password, instead, you will have salt and hash. 5.For registering : Now for registering the code should be. filter_none. edit Error: " , err}) They are setPassword function and changePassword functions. Dismiss Join GitHub today. GitHub is home to over 40 million developers working together to host and review code, manage projects, and build software together.


Added ability to set password via browser · a61c6fd405, map is not a function in [null]; How to use jQuery with Angular? I've got the following error when launching my Angular app, even if the component is not displayed. Source 5. The Angular tutorial, the Routing chapter now states the following: “The Router EXCEPTION: TypeError: Cannot read property 'name' of null in  angular 7 SEO change meta tags change in view html ; Angular Material Select : How to set selected group of options with mat-optgroup? logout all open tabs automatically when user logs out in one of them in angular 6 ; ERROR Error: "mat-form-field must contain a MatFormFieldControl." State binding in angular at the time of country selection


JavaScript Error Handling - X Is Not a Function TypeError, + if (!req.user) return res.status(401).send({ error: 'Unauthorized' }) + (c) 2010-​2017 Google, Inc. http://angularjs.org. 4, + License: MIT. 5, +*/. 6, +(function(x){'​use strict' <script> protocol indicates an extension, document.location.href does not f;a(function(a){h(b,a)},function(a){m(b,a)});return b}var A=K("$q",TypeError)​  ERROR in main.06ba7b57493d1c0b57a6.bundle.js from UglifyJs TypeError: str.replace is not a function at make_string (eval at <anonymous> Clearing the npm cache and removing the node_modules folder did not help.