angular - TypeError: _co.registerNow 不是函数

问题描述

我正在使用 angular9，我在登录下面的登录页面中创建了一个登录页面，我提供了我的注册页面 li，但是当我点击我的“立即注册”按钮时，它无法打开我的注册页面。下面我添加了我的代码，我不知道我犯错的地方

LoginComponent.html:43 ERROR TypeError: _co.registerNow is not a function
    at Object.eval [as handleEvent] (LoginComponent.html:43)
    at handleEvent (core.js:31467)
    at callWithDebugContext (core.js:32554)
    at Object.debugHandleEvent [as handleEvent] (core.js:32275)
    at dispatchEvent (core.js:21724)
    at core.js:30671
    at HTMLButtonElement.<anonymous> (platform-browser.js:600)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:421)
    at Object.onInvokeTask (core.js:28340)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:420) View_LoginComponent_0 @ LoginComponent.html:42 proxyClass @ compiler.js:22408 push../node_modules/@angular/core/fesm5/core.js.DebugContext_.logError @ core.js:32516 push../node_modules/@angular/core/fesm5/core.js.ErrorHandler.handleError @ core.js:4166 dispatchEvent @ core.js:21728 (anonymous) @ core.js:30671 (anonymous) @ platform-browser.js:600 push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:421 onInvokeTask @ core.js:28340 push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:420 push../node_modules/zone.js/dist/zone.js.Zone.runTask @ zone.js:188 push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask @ zone.js:503 invokeTask @ zone.js:1671 globalZoneAwareCallback @ zone.js:1697 LoginComponent.html:43 ERROR CONTEXT DebugContext_ {view: {…}, nodeIndex: 99, nodeDef: {…}, elDef: {…}, elView: {…}}

    <div class="app-body">
      <main class="main d-flex align-items-center">
        <div class="container">
          <div class="row">
            <div class="col-md-8 mx-auto">
              <div class="card-group">
                <div class="card p-4">
                  <div class="card-body">
                    <form>
                      <h1>Login</h1>
                      <p class="text-muted">Sign In to your account</p>
                      <small *ngIf='invalidLogin'>{{errorMessage}}</small>
                      <div class="input-group mb-3">
                        <div class="input-group-prepend">
                          <span class="input-group-text"><i class="icon-user"></i></span>
                        </div>
                        <input type="text" class="form-control" placeholder="Username"  [(ngModel)]="username" [ngModelOptions]="{standalone:
                          true}" autocomplete="username" required>
                      </div>
                      <div class="input-group mb-4">
                        <div class="input-group-prepend">
                          <span class="input-group-text"><i class="icon-lock"></i></span>
                        </div>
                        <input type="password" class="form-control" placeholder="Password" [(ngModel)]="password" [ngModelOptions]="{standalone:
                          true}"  autocomplete="current-password" required>
                      </div>
                      <div class="row">
                        <div class="col-6">
                          <button type="button" class="btn btn-primary px-4" (click)=handleLogin()>Login</button>
                        </div>
                        <div class="col-6 text-right">
                          <button type="button" class="btn btn-link px-0">Forgot password?</button>
                        </div>
                      </div>
                    </form>
                  </div>
                </div>
                <div class="card text-white bg-primary py-5 d-md-down-none" style="width:44%">
                  <div class="card-body text-center">
                    <div>
                      <h2>Sign up</h2>
                      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
                      <button type="button" class="btn btn-primary active mt-3" (click)="registerNow()">Register Now!</button>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </main>
    </div>

登录组件.ts

    import { Component, OnInit } from '@angular/core';
    import { Router } from "@angular/router";
    import { HardcodeauthService } from '../../service/hardcodeauth.service';


    @Component({
      selector: 'app-dashboard',
      templateUrl: 'login.component.html'
    })
    export class LoginComponent implements  OnInit{

      username ='nilmani'
      password = 'rock'
      errorMessage='Invalid Credential'
      invalidLogin = false

      constructor( private router : Router,
        private hardcodeauthservice :HardcodeauthService){}

      ngOnInit(){

      }
      handleLogin(){
        // if (this.username==='nilmani' && this.password==='dumy') {
        if (this.hardcodeauthservice.authenticate(this.username,this.password)) {
          this.router.navigate(['dashboard'])
          this.invalidLogin=false
        }else{
          this.invalidLogin=true
        }
        // console.log(this.username)
        // console.log(this.password)
      }


     }

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

    @Component({
      selector: 'app-dashboard',
      templateUrl: 'register.component.html'
    })
    export class RegisterComponent implements OnInit {

      constructor(private router : Router) { }

      ngOnInit(){

      }
      registerNow(){
          this.router.navigate(['registration'])
      }

    }

Registratoon.component.html

    <div class="app-body">
      <main class="main d-flex align-items-center">
        <div class="container">
          <div class="row">
            <div class="col-md-6 mx-auto">
              <div class="card mx-4">
                <div class="card-body p-4">
                  <form>
                    <h1>Register</h1>
                    <p class="text-muted">Create your account</p>
                    <div class="input-group mb-3">
                      <div class="input-group-prepend">
                        <span class="input-group-text"><i class="icon-user"></i></span>
                      </div>
                      <input type="text" class="form-control" placeholder="Username" autocomplete="username" required>
                    </div>
                    <div class="input-group mb-3">
                      <div class="input-group-prepend">
                        <span class="input-group-text">@</span>
                      </div>
                      <input type="text" class="form-control" placeholder="Email" autocomplete="email" required>
                    </div>
                    <div class="input-group mb-3">
                      <div class="input-group-prepend">
                        <span class="input-group-text"><i class="icon-lock"></i></span>
                      </div>
                      <input type="password" class="form-control" placeholder="Password" autocomplete="new-password" required>
                    </div>
                    <div class="input-group mb-4">
                      <div class="input-group-prepend">
                        <span class="input-group-text"><i class="icon-lock"></i></span>
                      </div>
                      <input type="password" class="form-control" placeholder="Repeat password" autocomplete="new-password" required>
                    </div>
                    <button type="button"  class="btn  btn-success">Create Account</button>
                  </form>
                </div>
                <div class="card-footer p-4">
                  <div class="row">
                    <div class="col-6">
                      <button class="btn btn-block btn-facebook" type="button"><span>facebook</span></button>
                    </div>
                    <div class="col-6">
                      <button class="btn btn-block btn-twitter" type="button"><span>twitter</span></button>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </main>
    </div>

标签： angular

angular - TypeError: _co.registerNow 不是函数

问题描述

解决方案

推荐阅读