Строка содержит недопустимый символ?

Я использую Angular уже некоторое время, но не эксперт. Я пытаюсь создать простую страницу с логином и паролем пользователя, но не с бэкэнд-сервисом.

Как только я ввожу свой пароль, я хочу направить свою страницу на панель инструментов. Я использую базовую среду пользовательского интерфейса и 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>

1 ответ

Решение

Вам необходимо определить тип ваших свойств. 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:

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

В вашем случае я нашел опечатку в вашем шаблоне следующим образом: <input type="password" class="form-control" placeholder="Password" [(ngModel)="data.password" >с ] пропущено в конце строки перед >

Я столкнулся с аналогичной проблемой, и все скомпилировалось хорошо, но не удалось во время выполнения.

Другие вопросы по тегам