Taking user in put in a Controller Array

Question

I am new with Angularjs. I want to take user input in my array of the controller

This is the html

<div class="col-md-6">
    <div class="row text-center">
        <div class="col-xs-6">
             <h4> data A:</h4>
        </div>
        <div class="col-xs-6">
             <h4><input type="text" class="form-control" ng-model="a"></h4>
        </div>
    </div>
    <div class="row text-center">
            <div class="col-xs-6">
                <h4>data B:</h4>
            </div>
            <div class="col-xs-6">
                <h4><input type="text" class="form-control" ng-model="b"></h4>
            </div>
    </div>

    <div class="row btn-primary text-center" ng-click="showData()">
        <i class="glyphicon glyphicon-folder-open" aria-hidden="true">
            <h4>data</h4>
        </i>
    </div>

and the controller

 $scope.infoSet =[
                {
                 "key" : "data A",
                 "value" : $scope.a
             },
             {
                 "key" : "data B",
                  "value" : $scope.b
             }];

 $scope.showData = function () {
    console.log($scope.infoSet);
    console.log($scope.a);
    console.log($scope.b);
}

How can i do that ? i have tried Difficulty with ng-model, ng-repeat, and inputs . But i cant put the input in proper format with this. please help . thanks in advance

What exactly isn't working for you? At a glance, it looks like what you have setup will update `$scope.a` and `$scope.b`, but not `$scope.infoSet` as it is setting `value` equal to primitive values on `a` and `b`, not the objects themselves. — Alexander Nied, Mar 24 '17 at 12:47
yes . Thank you so much for pointing it out. i guess i was making this mistake — , Mar 24 '17 at 12:57

score 1 · Accepted Answer · answered Mar 24 '17 at 12:46

1

Remove $scope.a and $scope.b, and use

ng-model="infoSet[0].value"

and

ng-model="infoSet[1].value"

answered Mar 24 '17 at 12:46

JB Nizet

678,734
91
1,224
1,255

score 0 · Answer 2 · answered Mar 24 '17 at 12:50

Or use ng-repeat

<div class="row text-center" ng-repeat="info in infoSet">
    <div class="col-xs-6">
         <h4>{{info.key}}</h4>
    </div>
    <div class="col-xs-6">
         <h4><input type="text" class="form-control" ng-model="info.value"></h4>
    </div>
</div>

Taking user in put in a Controller Array

2 Answers2