Check data according to the ready information

Question

I would like to make this form check the following data by clicking "Confirm" and if any of them is correct it will go to the next page.

MOCK:

$scope.cliente = [{
      nome: "nomeedit",
      senha: "senhaedit",
      email: "[email protected]"
    }, {
      nome: "nomezinho",
      senha: "senhazinha",
      email: "[email protected]"
    }, {
      nome: "nomelegal",
      senha: "senhalegal",
      email: "[email protected]"
    }, {
      nome: "meunome",
      senha: "minhasenha",
      email: "[email protected]"
    }, {
      nome: "nome",
      senha: "senha",
      email: "[email protected]"
    }];

HTML:

        <div class="container" ng-app="ClienteApp" ng-controller="ClienteController">

  <div class="form-group">
    <div class="input-group">
      <label>Nome:</label>
      <input type="text" class="form-control" ng-model="nome">
    </div>
    <div class="input-group">
      <label>Telefone:</label>
      <input type="text" class="form-control" ng-model="telefone">
    </div>
  </div>
  <a href="#" class="btn btn-sucess btn-sm" ng-click="consultar();">Confirmar</a>

Answer 1

I made a very simple example of how to solve this problem:

function LoginController($scope) {

  $scope.cliente = [{
    nome: "nomeedit",
    senha: "senhaedit",
    email: "[email protected]"
  }, {
    nome: "nomezinho",
    senha: "senhazinha",
    email: "[email protected]"
  }, {
    nome: "nomelegal",
    senha: "senhalegal",
    email: "[email protected]"
  }, {
    nome: "meunome",
    senha: "minhasenha",
    email: "[email protected]"
  }, {
    nome: "nome",
    senha: "senha",
    email: "[email protected]"
  }];

  $scope.consultar = function(user) {
    var verifica = false;
    //Faz um laço pegando cada cliente($scope.cliente)
    angular.forEach($scope.cliente, function(cliente) {
      //Se o nome do usuário e senha que vieram da página forem iguais a algum nome da lista de clientes então verifica recebe verdadeiro!
      if (user.nome == cliente.nome && user.senha == cliente.senha) {
        verifica = true;
        //Caso contrário recebe falso
      } else {
        verifica = false;
      }
    });

    //Se a variavel verifica for true então exibe um alerta positivo e envia para 			          a pagina desejada
    if (verifica) {
      $scope.submitted = true;
      $scope.message = "Usuário Válido";
      $scope.classAlert = "alert alert-success";
      //carrega outra página, aqui podemos utilizar a diretiva $location
      //$location.path("/pagina");

      //Se não exibe um alerta de erro
    } else {
      $scope.submitted = true;
      $scope.message = "Usuário Inválido";
      $scope.classAlert = "alert alert-danger";
    }

  };
}

@import url('http://getbootstrap.com/dist/css/bootstrap.css');

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app ng-controller="LoginController">
  <form class="form-inline" role="form">
    <div ng-class="classAlert" ng-show="submitted || showAlert">{{message}}
      <button class="close" data-dismiss="alert">x</button>
    </div>
    <div class="form-group">
      <label>Nome:</label>
      <input type="text" class="form-control" ng-model="user.nome">
    </div>
    <div class="form-group">
      <label>Senha:</label>
      <input type="password" class="form-control" ng-model="user.senha">
    </div>
    <button type="button" class="btn btn-default" ng-click="consultar(user)">Submit</button>
  </form>
</div>

Just make a test with the values of your list, to be redirected to another page you can use the directive $location. But for this it is recommended you configure your routes first.

Example:

$location.path("/home"); 

In this example after some action I call the page that is configured with the home route.

Example of how to configure a route, we use the $routeProvider: angular.module("system"). config(Function($routeProvider) {

$routeProvider.when("/home", {
    templateUrl: "public/views/login.html",
    controller: "loginController"
}

More information: routeProvider, Location

Answer 2

I recommend that you do not authenticate in this way. Never expose user authentication data.

Anyway, to check if a given object is part of an array just iterate over it and check field by field.

Ex:

$scope.cliente.forEach(function(cliente) {
  if ($scope.nome === cliente.nome && $scope.senha === cliente.senha) {
    // Lógica para prosseguir entra aqui
  }
})

But I reinforce again that doing this query on the client is the worst security breach that your code could have.