Question

我正在开发一个项目，我正在尝试将User对象添加到具有用户输入属性的Logins数组中。

一旦添加到Logins数组，我就试图在单个列表项中显示User对象（id，firstName，lastName）。每个新用户都会在列表中添加下一行。

我正在尝试做的是使对象的每个属性都可访问，以便通过搜索user.id来执行诸如验证多个ID /重复名称之类的操作。现在我只能从数组中显示我正在推送我的数据，作为三个列表项。

有没有办法存储我的用户输入，以便我可以在一个列表项中显示User对象本身，而不是（看起来像什么）三个独立的数据？代码：

<!DOCTYPE html>
<html  ng-app>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular.js"></script>
<script type='text/javascript'>

function LoginController($scope) {
    $scope.user = {
        id: "",
        firstName: "",
        lastName: ""
    };
    $scope.logins = [];
    $scope.login = function () {
        $scope.logins.push($scope.user.id, $scope.user.firstName, $scope.user.lastName);
        console.log($scope.logins);

    };

}
</script>
</head>
<body>
  <div ng-app ng-controller="LoginController">
    <div>Hello {{ user.firstName }}</div>
    <input ng-model="user.id"></input>
    <input ng-model="user.firstName"></input>
    <input ng-model="user.lastName"></input>

    <input type="submit" ng-click="login()" value="Login"></input>
    <ul>
    <li ng-repeat="login in logins">{{ login }}</li>
    </ul>    
</div>
</body>
</html>

Answer 1

您希望logins成为用户数组（因此应将其命名为users）。所以替换

$scope.logins.push($scope.user.id, $scope.user.firstName, $scope.user.lastName);

通过

$scope.logins.push($scope.user);

我猜你也希望当前编辑过的用户在将之前编辑的用户添加到数组后成为新的空用户，所以添加

$scope.user = {
    id: "",
    firstName: "",
    lastName: ""
};

从AngularJS中的数组中获取/显示对象和属性

1 个答案: