Question

我现在使用Angular一段时间但不是专家。我正在尝试创建一个简单的用户登录名和密码页，暂时没有后端服务。

输入密码后，我想将页面路由到仪表板。我正在使用核心UI框架和Angular 4.现在我有一个未被捕获的错误。如何解决以下错误？

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

您需要定义属性的类型。 Newline: -1 Cr: -1 Lf: 6不包含您的属性：

Object

或者，如果您不想定义类型，可以通过将类型指定为interface YourDataType { username?: string; password?: string; } export class LoginComponent { data: YourDataType = {}; // .... formSubmit() { if (this.data.username == "admin" && this.data.password == "admin") { // No error } } }来选择退出：

any

Answer 2

在您的情况下，我在您的模板中发现了这样的错字：<input type="password" class="form-control" placeholder="Password" [(ngModel)="data.password" >和] 在行的末尾在>

我遇到了类似的问题，并且一切都编译良好，但是在运行时失败了。

字符串包含无效字符？

2 个答案: