Отправка угловой формы с неопределенным результатом при попытке войти в Firebase - PullRequest
Новая
       134

Отправка угловой формы с неопределенным результатом при попытке войти в Firebase

0 голосов
/ 06 марта 2019

Я пытался выяснить, что происходит, и гуглил много раз. Одним из мест, которые я нашел, был этот пост (https://www.positronx.io/create-user-with-email-password-in-firebase-and-angular/). Я следил за ним как мог, но продолжал сталкиваться с этой ошибкой.

Редактировать: Сообщение об ошибке 

ERROR TypeError: Cannot read property 'SignIn' of undefined
    at Object.eval [as handleEvent] (SigninComponent.html:57)
    at handleEvent (core.js:19545)
    at callWithDebugContext (core.js:20639)
    at Object.debugHandleEvent [as handleEvent] (core.js:20342)
    at dispatchEvent (core.js:16994)
    at core.js:17441
    at HTMLButtonElement.<anonymous> (platform-browser.js:993)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:423)
    at Object.onInvokeTask (core.js:14051)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:422)
View_SigninComponent_0 @ SigninComponent.html:56
proxyClass @ compiler.js:17129
push../node_modules/@angular/core/fesm5/core.js.DebugContext_.logError @ core.js:20601
push../node_modules/@angular/core/fesm5/core.js.ErrorHandler.handleError @ core.js:12549
dispatchEvent @ core.js:16998
(anonymous) @ core.js:17441
(anonymous) @ platform-browser.js:993
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:423
onInvokeTask @ core.js:14051
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:422
push../node_modules/zone.js/dist/zone.js.Zone.runTask @ zone.js:195
push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask @ zone.js:498
invokeTask @ zone.js:1744
globalZoneAwareCallback @ zone.js:1770
SigninComponent.html:56 ERROR CONTEXT DebugContext_ {view: {…}, nodeIndex: 21, nodeDef: {…}, elDef: {…}, elView: {…}}

Мой текущий код для моего signin.component.html : 

    <!-- Default form contact -->
    <form class="text-center border border-light p-5" [formGroup]="contactForm">

      <p class="h4 mb-4">Contact us</p>

      <!-- Name -->
      <input type="text" formControlName="email" id="defaultContactFormName" mdbInput
        class="form-control mb-4" placeholder="Email">

      <!-- Email -->
      <input type="password" formControlName="password" id="defaultContactFormEmail" mdbInput
        class="form-control mb-4" placeholder="password">
  <button mdbBtn color="info" outline="true" block="true" class="z-depth-0 my-4 waves-effect"
    mdbWavesEffect type="submit" (click)="authenticationService.SignIn(email.value, password.value)" [disabled]="disabledSubmitButton">Send</button>

</form>

Мой текущий код для signin.component.ts : 

import { Component, OnInit,HostListener } from '@angular/core';
import {AuthenticationService} from '../authentication.service';
import { FormGroup, FormBuilder, Validators } from '@angular/forms';

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

  contactForm: FormGroup;
disabledSubmitButton: boolean = true;
optionsSelect: Array<any>;

  @HostListener('input') oninput() {

  if (this.contactForm.valid) {
    this.disabledSubmitButton = false;
    }
  }

  constructor(public authservice:AuthenticationService,private fb: FormBuilder) {
    this.contactForm = fb.group({
      'email': ['', Validators.compose([Validators.required, Validators.email])],
      'password': ['', Validators.required],
      });
   }

  ngOnInit() {
  }

}

Этот компонент должен взаимодействовать с функцией SignIn для AngularFire после отправки: 

import { Injectable } from '@angular/core';
import { Router } from "@angular/router";
import {AngularFireAuth} from '@angular/fire/auth'

@Injectable({
  providedIn: 'root'
})

export class AuthenticationService {

  constructor(
    public afAuth:AngularFireAuth,
    public router: Router
  ) { }

  // Sign in with email/password
  async SignIn(email:string, password:string) {
    debugger
    return await this.afAuth.auth.signInWithEmailAndPassword(email, password)
      .then((result) => {
         this.router.navigate(['/dashboards/v1']);
         console.log(result.user)
      }).catch((error) => {
        window.alert(error.message)
      })
  }

Любые предложения будут с благодарностью. Спасибо

...