up vote 2 down vote favorite

Hello Everyone I have face a problem to create a object with ng-repeat. when i declare the Object then the same value in filled in the text box which has same ng-model value. if i am not Declare the object then duplicacy is not occures. If i am declare the $scope.user = {}; in js file then problem is occures. please check this. Give me a solution ASAP.

My Fiddle Link Please Check This http://jsfiddle.net/Ladjkp5s/1/

Here is my Html file

<div ng-app="myApp">
  <div ng-controller='MainController' ng-init="start = 0; end = 5;">
     Start: <input ng-model="start"> End: <input ng-model="end">
     <ul>
       <li ng-repeat="item in items | slice:start:end">{{item + 1}}
          <div>
           Name: <input type="text" ng-model="user.name"><br>
           Address:  <input type="text" ng-model="user.add"><br>
           Phone:  <input type="text" ng-model="user.phn"><br>
           ZipCode:  <input type="text" ng-model="user.zip">
         </div>
       </li>
    </ul>
  </div>
</div>

Here is my JS File

var app = angular.module('myApp', []);
app.filter('slice', function() {
   return function(arr, start, end) {
   return arr.slice(start, end);
  };
});
app.controller('MainController', function($scope) {
 $scope.items = [];
  $scope.user ={};
   for (var i = 0; i < 5; i++) $scope.items.push(i);
});

Thanks.

share
    
Please try to avoid comments such as "Give me a solution ASAP." on SO. – artm Nov 24 '14 at 13:09
    
ok (artm) next tym this is not repeat – Abhishek Nov 24 '14 at 13:11
up vote 2 down vote accepted

The problem is that you are using same ng-model for every item.(user.fieldName) you have to use item.fieldName.

<div ng-app="myApp">
  <div ng-controller='MainController' ng-init="start = 0; end = 5;">
    Start: <input ng-model="start"> End: <input ng-model="end">
    <ul>
      <li ng-repeat="item in items | slice:start:end">{{item.index + 1}}
       <div>
            Name: <input type="text" ng-model="item.name"><br>
           Address:  <input type="text" ng-model="item.add"><br>
           Phone:  <input type="text" ng-model="item.phn"><br>
           ZipCode:  <input type="text" ng-model="item.zip">
         </div>
      </li>
    </ul>
  </div>
</div>

http://jsfiddle.net/3akwk7tv/

share
    
Thanks #Rasalom. it's working for me. thanks for solution. – Abhishek Nov 24 '14 at 13:57
up vote 0 down vote

Yuu can not loop in controller function, but u can create controller that loops in html like in this example 

<ul>
  <li ng-repeat="theItem in myData.items">{{theItem.text}}</li>
</ul>

<script>
    angular.module("myapp", [])
    .controller("MyController", function($scope) {
        $scope.myData = {};
        $scope.myData.items = [ {text : "one"}, {text : "two"}, {text : "three"} ];
    });
</script>
share
    
Thanks #Strahinja Radju Djuric. thanks for solution. – Abhishek Nov 24 '14 at 13:58

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.