angularjs - All values in array bound to same value -
i'm trying update values inside $scope.match.teams[0] vaules players' names, when input in single field, bound every players' name team.
controller:
$scope.match = { teams: [ { id: 0, name: "", players: [ { id: 1, name: "" }, { id: 2, name: "" }, { id: 3, name: "" }, { id: 4, name: "" }, { id: 5, name: "" }, { id: 6, name: "" }, { id: 7, name: "" }, { id: 8, name: "" }, { id: 9, name: "" }, { id: 10, name: "" }, { id: 11, name: "" }, ] }, { id: 1, name: "", players: [ { id: 1, name: "" }, { id: 2, name: "" }, { id: 3, name: "" }, { id: 4, name: "" }, { id: 5, name: "" }, { id: 6, name: "" }, { id: 7, name: "" }, { id: 8, name: "" }, { id: 9, name: "" }, { id: 10, name: "" }, { id: 11, name: "" }, ] } ] }; $scope.battingfirstselected = function(){ switch ($scope.battingfirst.id) { case 0: $scope.battingsecond = $scope.match.teams[1]; case 1: $scope.battingsecond = $scope.match.teams[0]; } };
html:
team batting first: <select ng-change="battingfirstselected()" ng-model="battingfirst" ng-options="team.name team in match.teams"> </select> <div ng-repeat="player in battingfirst.players"> <input class="form-control" ng-model="match.teams[battingfirst.id].player.name" value="" /> </div> <div ng-repeat="player in match.teams[battingfirst.id].players"> {{ match.teams[battingfirst.id].player.name }} </div>
the selection of team works fine, it's assigning names that's problem here.
the output of {{ match.teams[battingfirst.id] }}
shows i'm creating new team every time fill in 1 of inputs, { player: {"name":"sdf"} }
object attached it.
you need try:
ng-model="player.name"
your battingfirst
selected team above select. when bind players
in battingfirst
, bind correctly players
of selected team.
<div ng-repeat="player in battingfirst.players"> <input class="form-control" ng-model="player.name" value="" /> </div>
the problem have because ng-repeat creates child scopes. therefore match.teams
inside ng-repeat is not same match.teams
of parent scope.
Comments
Post a Comment