Angular 2:比较JSON中的用户输入值

时间:2017-04-09 14:38:30

标签: angular

我是Angular 2的新手,想要将用户输入值与json中的数据进行比较。我附加了我正在尝试编码的代码。登录表单具有用户名和密码,用户需要使用json中的数据对其进行验证。如果验证为真,我需要在变量中与该键相关的其他相邻对象。

这只是我正在尝试的练习代码而不是实际项目

// login.component

import { Component, OnInit } from '@angular/core';
import { Http, Response } from '@angular/http';
import { DataService } from '../data.service'

@Component({
  selector: 'app-login',
  templateUrl: './login.component.html',
  styleUrls: ['./login.component.css'],
  providers: [DataService]
})
export class LoginComponent implements OnInit {
login:any;
loginList:any;
  constructor(private dataService: DataService) { }

  ngOnInit() {
    this.dataService.getLoginData()
    .subscribe(
      (data => this.login = data)
    );
  }

  loginSubmit(value){
    console.log(value);
  }

}


// JSON

[{
	"username": "jay",
	"password": "jay",
	"userType": "standard"
}, {
	"username": "Admin",
	"password": "Admin",
	"userType": "admin"
}, {
	"username": "newuser",
	"password": "newuser",
	"userType": "standard"
}, {
	"username": "anonmyous",
	"password": "anonmyous",
	"userType": "standard"
}]
<div class="container" id="lgBox">
<form class="form-group" #lgForm="ngForm" (ngSubmit)="loginSubmit(lgForm.value)">
  <div class="loginRow"><h4 class="text-center">Login</h4></div>
  <div class="loginRow"><input type="text" #username name="username" ngModel class="form-control" placeholder="Username" required /></div>
  <div class="loginRow"><input type="password" #password name="password" ngModel class="form-control" placeholder="Password" required  /></div>
  <div class="loginRow"><button class="btn btn-primary btn-block/">Login</button></div>
</form>
</div>

1 个答案:

答案 0 :(得分:1)

这是检查登录的功能:

loginSubmit(value){
    for(let i=0 ; i< this.login.length; i++)
    {
        if (this.login[i].username === value.username && this.login[i].password === value.password)
        {
            console.log("User Found" , this.login[i]);
        }
    }    
}