AngularJSの配列からオブジェクトとプロパティを取得/表示する

ユーザーが入力したプロパティを持つLogins配列にUserオブジェクトを追加しようとしているプロジェクトで作業しています。AngularJSの配列からオブジェクトとプロパティを取得/表示する

一度Logins配列に追加すると、Userオブジェクト（id、firstName、lastName）を1つのリスト項目に表示しようとしています。それぞれの新しいユーザーは、リストの次の行に追加されます。

私がしようとしているのは、user.idを検索して複数のID /重複名の検証などを行うために、オブジェクトの各プロパティをアクセス可能にすることです。今私は3つのリスト項目としてデータをプッシュしていることを配列から表示できました。

私のユーザー入力を格納する方法はありますか？3つの別個のデータではなく、1つのリスト項目に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>

出典

2016-11-06 Jeremy Stone

あなたはloginsは（これusers名前を付ける必要があります）、ユーザーの配列になりたいです。だから私はあなたにも、現在編集したユーザは、アレイに追加されました以前に編集した1度新しい空のユーザーになりたいと思い

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

によって

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

を交換するので、追加

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

出典

2016-11-06 19:30:42

これは機能します！なぜ私はすべてのことをプッシュする必要があると思ったのか分かりません。データを文字列形式で表示するにはどうすればよいですか？ –

{{user.id}} - {{user.firstName}} {{user.lastName}}（たとえば） –

AngularJSの配列からオブジェクトとプロパティを取得/表示する

答えて

関連する問題