AngularJS variable in scope - use variables of different scope

Question

I would have a question concerning variables in scope and visibility. Currently I have two controller variables:

vm.selectedUser vm.selectedUserRole

The problem is, that I generate the tables in a ng-repeat loop and all inputs and selects in the different tables share this two mentioned variables above.

My question now would be how can I use this two parameters above in my method:

    vm.addInstitutionUserConnection(institutionUserConnectionContent.institution, institutionUserConnectionContent, selectedUser, selectedUserRole)

Is there any chance to do this because the input, select elements and the span-button element (add user) have different scopes (this is my guess - I don't know exactly)

Thanks a lot for help!

<div ng-repeat="institutionUserConnectionsOfInstitution in vm.institutionUserConnectionsOfInstitutions">
<div ng-repeat="institutionUserConnectionContent in institutionUserConnectionsOfInstitution.institutionUserConnectionContents">
    <div ng-show="addUser" class="row">
        <table>
           <tr>
                <td class="adduserinput">
                    <input 
                        type="text" 
                        class="form-control" 
                        placeholder="Benutzer durchsuchen" 
                        ng-model="vm.selectedUser"
                        typeahead="user as vm.userLabelFormatter(user) for user in vm.getUsersByTerm($viewValue) | limitTo:5"
                        typeahead-min-length="3"
                        typeahead-wait-ms="100"
                        typeahead-editable="false" />
                </td>
                <td class="adduserroles">
                    <select class="form-control" ng-model="vm.selectedUserRole" ng-options="role as role for role in vm.roles">
                    </select>
                </td>
                <td>
                    <span class="input-group-btn">
                        <button class="btn btn-default" type="button" ng-click="vm.addInstitutionUserConnection(institutionUserConnectionContent.institution, institutionUserConnectionContent)">add user</button>
                      </span>
                </td>
           </tr>
        </table>
    </div>
</div>

Answer 1

Do it like this -

<div ng-repeat="institutionUserConnectionsOfInstitution in vm.institutionUserConnectionsOfInstitutions">
<div ng-repeat="institutionUserConnectionContent in institutionUserConnectionsOfInstitution.institutionUserConnectionContents">
    <div ng-show="addUser" class="row">
        <table>
           <tr>
                <td class="adduserinput">
                    <input 
                        type="text" 
                        class="form-control" 
                        placeholder="Benutzer durchsuchen" 
                        ng-model="institutionUserConnectionContent.selectedUser"
                        typeahead="user as vm.userLabelFormatter(user) for user in vm.getUsersByTerm($viewValue) | limitTo:5"
                        typeahead-min-length="3"
                        typeahead-wait-ms="100"
                        typeahead-editable="false" />
                </td>
                <td class="adduserroles">
                    <select class="form-control" ng-model="institutionUserConnectionContent.selectedUserRole" ng-options="role as role for role in vm.roles">
                    </select>
                </td>
                <td>
                    <span class="input-group-btn">
                        <button class="btn btn-default" type="button" ng-click="vm.addInstitutionUserConnection(institutionUserConnectionContent.institution, institutionUserConnectionContent, institutionUserConnectionContent.selectedUser, institutionUserConnectionContent.selectedUserRole)">add user</button>
                      </span>
                </td>
           </tr>
        </table>
    </div>
</div>

Explanation -

I just changed the vm to institutionUserConnectionContent. reason - since you'll have multiple rows in the table (ng-repeat), if you use vm, you would end up with overwriting the same selectedUser and selectedUser of one row with other.

Hope this helps.