CODEWITHSUNDEEP
angularjs
user838437
user838437

Reputation: 1501

AngularJS - Using ng-repeat twice under the same controller

I have the following DIV:

<div ng-controller="userControl">
    <div ng-repeat="user in users">
        <u>{{user.id}} : {{user.name}}</u><br />
        <div ng-repeat="role in user.roles">
            {{role.name}}
        </div>
        <br />
    </div>
    <form ng-submit="addRoleToUser()">
        <select name="userSelect">
        <div ng-repeat="user in users">
                <option value="{{user.id}}">{{user.name}}</option>
        </div>
        </select>
        <input type="submit" value="add">
    </form>
</div>

This is my controller:

function userControl($scope,$http) {
    $scope.users = [
                        {"id":"0","name":"Username1","roles":[{}]},
                        {"id":"1","name":"Username2","roles":[{}]},
                    ]

    $scope.addUser = function() {
        var nextid = $scope.getNextId();
        $scope.users.push({id:nextid,name:$scope.userName});
        /*
        $.post({}); //Push changes to server
        */
        $scope.userName = '';
    };

    $scope.getNextId = function() {
        var count = 0;
        angular.forEach($scope.users, function(data) {
          count = data.id;
        });
        var count2 = parseInt(count)+1;
        return count2;
     };

}

I can see the first ng-repeat is working fine and is listing the user.id and user.name, however the second ng-repeat (the one inside the form) does not display the information, is that related to the fact that I've already looped through that element in the previous div?

Upvotes: 0

Views: 1508

Answers (1)

Florian F
Florian F

Reputation: 8875

You misused the select directive :

<select ng-model="selectedUser" name="userSelect" ng-options="user.id as user.name for user in users">

http://docs.angularjs.org/api/ng.directive:select

Upvotes: 1

Related Questions