使用AngularJS登录页面

var app = angular.module('myApplication', []);
app.controller('UserListCtrl', function ($scope) {   
  $scope.usersList = [    
      {
          name: 'Alex',
          pass: 2200201
      },
      {
          name: 'Michael',
          pass: 1231215   
      },
      {
          name: 'John',
          pass: 1232116   
      }
  ];
  $scope.checkInputs = function () {
      $scope.searchUser = {
          name: $scope.yourName,
          pass: $scope.yourPass
      };
      if ($scope.searchUser.name === $scope.usersList.name) {
          console.log($scope.searchUser.name);
      } else {
          console.log('You are not registered');
      }
  };
});

<form ng-submit="checkInputs()">
        <input type="text" ng-model="searchUser.yourName"><br>
        <input type="text" ng-model="searchUser.yourPass">
        <input type="submit" class="button">
</form>

重要说明：此答案涉及问题中发布的特定代码中存在的不同错误，如

• 检查字符串是否包含在对象数组中
• 视图和模型之间的 AngularJS 数据绑定

此处公开的代码不应被视为有效的身份验证解决方案

---

我需要检查用户在输入表单中键入的用户名是否等于用户数组中的用户名

为了实现这一目标，您写了$scope.searchUser.name === $scope.usersList.name.这将失败，因为userList不是字符串，而是字符串数组。为了检查名称是否在 userList 数组中，您可以使用函数 indexOf。

indexOf（） 方法返回可以在数组中找到给定元素的第一个索引，如果不存在，则返回 -1。

1） 替换 ：

if ($scope.searchUser.name === $scope.usersList.name) {
    // ...
}

跟

解决方案 1：假设您使用像 lodash 或下划线这样的库和 pluck 函数：

var userNames = _.pluck($scope.usersList, 'name');
if (userNames.indexOf($scope.searchUser.name) >= 0) {
    // ...
}

解决方案2：为自己定义一个pluck函数：

var myPluck = function (propertyName, array) {
    return array.map(function(obj) {
        return obj[propertyName];
    })
}
var userNames = myPluck('name', $scope.usersList);
if (userNames.indexOf($scope.searchUser.name) >= 0) {
    // ...
}

2） 替换 ：

$scope.searchUser = {
    name: $scope.yourName,
    pass: $scope.yourPass
};

跟

$scope.searchUser = {
    name: '',
    pass: ''
};

3）最后，在html模板中，替换：

<input type="text" ng-model="searchUser.yourName"><br>
<input type="text" ng-model="searchUser.yourPass">

跟

<input type="text" ng-model="searchUser.name"><br>
<input type="text" ng-model="searchUser.pass">

这是你的工作 jsfiddle

 <form  ng-submit="checkInputs(searchUser)">
            <input type="text" ng-model="searchUser.yourName"><br>
            <input type="text" ng-model="searchUser.yourPass">
            <input type="submit" class="button">
    </form>        

function formCtrl($scope){
         $scope.usersList = [    
          {
              name: 'Alex',
              pass: 2200201
          },
          {
              name: 'Michael',
              pass: 1231215   
          },
          {
              name: 'John',
              pass: 1232116   
          }
      ];
         $scope.checkInputs = function (credentials) {
             var auth = false;
             angular.forEach($scope.usersList, function(value){
                 if(value.name == credentials.yourName && value.pass == credentials.yourPass){
                     auth = true;
                 }
                 if(!auth){
                     $scope.message= "You are not authorized";
                 }
                 else
                 {
                     $scope.message= "Authorized";
                 }
             });
         }
    }