Привязать массив объектов к $ scope

Question

Привязать массив объектов к $ scope

0

<div data-ng-repeat="div in divs">
    <label>First Name</label>
    <input type="text" name="fname" ng-model="user.fname[$index]">
    <label>Second Name</label>
    <input type="text" name="sname" ng-model="user.sname[$index]">
</div>
<button ng-click="addDivs()">Add More Person</button>


angular.module('user', []).controller('UserCtrl', function($scope){
    $scope.divs = [1];
    $scope.addDivs = function(){
        $scope.divs.push({});
    }
}

Когда у нас есть 2 divs, требуемый формат данных:

[{fname: 'name1', sname: 'name2'}, {fname: 'name3', sname: 'name4'}]

Но результат был следующим:

{fname: ['name1', 'name3'], sname: ['name2', 'name]}

Как смоделировать html для получения данных в нужном формате?

Sachin Goel 12 янв. 2017, в 11:59

Источник

0

Одна вещь, которая бросается в глаза, хотя это может не решить вашу проблему, это то, что в вашем шаблоне вы ссылаетесь на «sname», но в формате кода, который, как вы говорите, вам требуется, у вас есть «scname» (обратите внимание на несоответствие орфографии).
rrd 12 янв. 2017, в 10:59
0

$scope.user=[]; и <input type="text" name="fname" ng-model="user[$index].fname"> же самое для sname - ng-model="user[$index].sname" - plnkr.co/edit / sqEZexWeiR6WwfiSf0BL? р = предварительный просмотр
Developer 12 янв. 2017, в 11:42

Теги:

html

angularjs

mean-stack

html5

angularjs-directive

1 ответ

Ещё вопросы

Одна вещь, которая бросается в глаза, хотя это может не решить вашу проблему, это то, что в вашем шаблоне вы ссылаетесь на «sname», но в формате кода, который, как вы говорите, вам требуется, у вас есть «scname» (обратите внимание на несоответствие орфографии).
$scope.user=[]; и <input type="text" name="fname" ng-model="user[$index].fname"> же самое для sname - ng-model="user[$index].sname" - plnkr.co/edit / sqEZexWeiR6WwfiSf0BL? р = предварительный просмотр

superUser · Answer 1 · 2017-01-12T10-05-00.000Z

Это то, чего вы ожидаете?

angular.module('user', []).controller('UserCtrl', function($scope){
  $scope.persons = [];  
  $scope.addDivs = function(){
        $scope.persons.push({fname: $scope.user.fname, sname: $scope.user.sname});
    }
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="user" ng-controller="UserCtrl">
<div>
    <label>First Name</label>
    <input type="text" name="fname" ng-model="user.fname">
    <label>Second Name</label>
    <input type="text" name="sname" ng-model="user.sname">
</div>
  <div data-ng-repeat="person in persons"> {{person.fname}}  {{person.sname}}</div>
<button ng-click="addDivs()">Add More Person</button>

</div>