String enthält ein ungültiges Zeichen?

Question

Ich benutze Angular für eine Weile, aber nicht das eines Experten. Ich versuche, eine einfache Benutzeranmeldung und eine Passwort-Seite vorerst nicht mit einem Backend-Service zu erstellen.

Sobald ich mein Passwort eingegeben habe, möchte ich meine Seite zum Dashboard leiten. Ich benutze Core UI Framework und eckige 4. Es gab wenige Fehler, aber wurden mit Hilfe von Menschen von hier gelöst. Jetzt habe ich einen nicht gefundenen Fehler. Wie kann ich folgende Fehler beheben?

login.component.ts

import { Component } from '@angular/core'; 
import { Router } from '@angular/router'; 
import { DashboardComponent } from '../dashboard/dashboard.component'; 

declare var Dashboard:any; 

@Component({ 
templateUrl: 'login.component.html', 
}) 
export class LoginComponent { 
data: any = {}; 
constructor(private router: Router){} 
formSubmit(){ 
if(this.data.username == "admin" && this.data.password == "admin"){ 
    this.router.navigate([Dashboard]); 
} 
} 
} 

login.component.html

<div class="app flex-row align-items-center" (ngSubmit)="formSubmit()"> 
    <div class="container"> 
    <div class="row justify-content-center"> 
    <div class="col-md-8"> 
    <div class="card-group mb-0"> 
    <div class="card p-2"> 
    <div class="card-block"> 
      <h1>Login</h1> 
      <p class="text-muted">Sign In to your account</p> 
      <div class="input-group mb-1"> 
      <span class="input-group-addon"><i class="icon-user"></i></span> 
      <input type="text" class="form-control" placeholder="Username" [(ngModel)="data.username"]> 
      </div> 
      <div class="input-group mb-2"> 
      <span class="input-group-addon"><i class="icon-lock"></i></span> 
      <input type="password" class="form-control" placeholder="Password" [(ngModel)="data.password" > 
      </div> 
      <div class="row"> 
      <div class="col-6"> 
      <button type="button" class="btn btn-primary px-2">Login</button> 
     </div> 
     </div> 
     </div> 
     </div> 
     </div> 
     </div> 
     </div> 
     </div> 
     </div> 

Answer 1

Sie müssen den Typ Ihrer Eigenschaften definieren. Object nicht Ihren Eigenschaften enthalten:

interface YourDataType { 
    username?: string; 
    password?: string; 
} 

export class LoginComponent { 
    data: YourDataType = {}; 
    // .... 
    formSubmit() { 
     if (this.data.username == "admin" && this.data.password == "admin") { // No error 
     } 
    } 
} 

Oder wenn Sie nicht die Typen definieren wollen, können Sie durch die Angabe der Art, wie any Opt-out:

export class LoginComponent { 
    data: any = {}; 
    // .... 
    formSubmit() { 
     if (this.data.username == "admin" && this.data.password == "admin") { // No error 
     } 
    } 
}