Input can not be read | Angularfire + Firebase

Question

So, I have a select input within a angular repeated item. I want to use a button to assign rooms to a person. As well as maintain if a person has rooms selected, it will show that it is already assign within the selection input.

Here my Firebase Data:

{
  "-JLtuRmYiTDLTnZPj" : {
    "last_name" : "NameOne",
    "person_id" : 1,
    "is_in" : false
  },
  "-JLtuRBlyWhHV28zd" : {
    "last_name" : "NameTwo",
    "person_id" : 2,
    "is_in" : false
  },
  "-JLtuQxlMn25APuKT" : {
    "last_name" : "NameThree",
    "person_id" : 3,
    "is_in" : false
  }
}

Here is my code:

<table>
    <tbody>
      <tr ng-repeat="(name, person) in people | orderBy: 'doctor_id'" ng-model="person">
        <td>{{person.person_id}}</td>
        <td>{{person.last_name}}</td>
        <td><strong>{{person.is_in}}</strong></td>
        <td>Assign Rooms: <select multiple class="form-control" ng-model="person.room_id" ng-options="r.room_id as r.name for (key, r) in rooms"></select></td>
        <td><button type="button" href="" class="btn btn-primary" ng-click="assignRooms(name)">Assign Rooms</button></td>
      </tr>
    </tbody>
</table>

And Finally my JS:

angular.module('app', ['ngRoute', 'firebase']);

$scope.people = $firebase(new Firebase("https://<FB-NAME>.firebaseio.com/dev/0/people"));
$scope.rooms = $firebase(new Firebase("https://<FB-NAME>.firebaseio.com/dev/0/rooms"));

//Assigns Rooms to each doctor.
$scope.assignRooms = function(name) {

    $scope.people.$child(name).$update({
        "room_id": $scope.person.room_id,
        "is_in": true
        });     
}

The app is being called correctly. I can see the scopes when I use Angular JS Batarang. When I click the Assign Rooms button I get the error:

Cannot read property 'room_id' of undefined

from this: $scope.person.room_id.

I am sure it's something obvious I am missing. But any help is greatly appreciated.

Thank You!

Answer 1

You need to use person. You can not access the ng-repeat scope within the function.

<td>
    <button type="button" 
            href="" 
            class="btn btn-primary" 
            ng-click="assignRooms(name,person)">Assign Rooms</button>
</td>

---

$scope.assignRooms = function(name, person) {$scope.assignRooms = function(name) {

    $scope.people.$child(name).$update({
    "room_id": person.room_id,
    "is_in": true
    });     
}