Site not loading record

Question

I have an application that when I debug, I can see the data is being set properly, but when the page loads, nothing is populated in the textbox.

 

Here is the list code and what happens when a row is clicked.

<tbody>
        <tr data-ng-repeat="organization in organizations | filter:search" data-ng-click="navToEdit($index)">
            <td>{{organization.Id}}</td>
            <td>{{organization.Title}}</td>
        </tr>
</tbody>

 Here's my controller. 

app.controller("organizationsCtrl", ["$scope", "$location", "$routeParams", "spService",
    function ($scope, $location, $routeParams, spService) {
        var listTitle = "Organizations";

        $scope.editing = false;

        //example populating Organizations
        spService.getRecords(listTitle, "?$select=ID,Title").then(function (result) {
            $scope.organizations = result;
        });

        $scope.navToAdd = function() {
            $location.path("/organizations/add");
        }

        $scope.navToEdit = function(index) {
            $scope.organization = $scope.organizations[index];
            $location.path("/organizations/" + index);
            debugger;
            //$scope.getRecord(index);
        }
    }
]);

 The same controller is used for "/organizations", "/organizations/add" and "/organizations/:index".

 

Here is the HTML routing takes the user to.

 

<div class="form-group">
    <label for="txtTitle">Title:</label>
    <input type="text" type="text" id="txtTitle" class="form-control" data-ng-model="organization.Title" />
</div>
<div class="form-group">
    <button data-ng-click="save()" class="btn btn-primary">Save</button>
    <button data-ng-click="delete()" class="btn btn-primary">Delete</button>
    <button data-ng-click="cancel()" class="btn btn-primary">Cancel</button>
</div>

 

 

When the debugger kicks off, I can see $scope.organization is populated correctly, but when the page fully loads the textbox never populates.

 

Any help is appreciated!