Cannot access object data with ng-repeat - angularjs

Question

I have an app using routing and I'm working with my first route. The view loads correctly, and I'm able to access data objects in the controller linked to the view, but not the objects created in a function in the controller. Here are code snippets:
html:
<div>
<label>Select Table : </label>
<select ng-init="permits.lookups.selectedLookup = lookupLists[0].list" ng-model="permits.lookups.selectedLookup" ng-options="lookupList.list as lookupList.desc for lookupList in lookupLists" ng-change="populateLookup(permits.lookups.selectedLookup)"></select>
Selected lookup: {{permits.lookups.selectedLookup}}
<table>
<tbody>
<tr><td>first row</td></tr>
<tr ng-repeat="column in columns"><td>{{column.name}}</td></tr>
<tr><td>last row</td></tr>
</tbody>
</table>
</div>
js:
(function() {
var app = angular.module('lookups',[]);
app.controller('UpdateLookups', function($scope, $http) {
var lookups = this;
$scope.lookupLists = [
{list : "0", "desc" : "--Select List--"},
{list : "del_type", "desc" : "Delivery Type"},
{list : "pay_type", "desc" : "Payment Types"},
{list : "trans_type", "desc" : "Transaction Type"}
];
$scope.selectedLookup = $scope.lookupLists[0].list;
$scope.populateLookup = function(lookup) {
$http({
url : <some URL>
dataType : "json",
method : "POST",
data : "action=3&lookup="+lookup,
headers : {"Content-Type" : "application/x-www-form-urlencoded; charset=utf-8"}
}).success(function(data) {
if ( angular.isArray(data.columns)) {
lookups.columns = data.columns;
} else {
lookups.columns = [data.columns];
}
}).error(function(error){
alert("There was an error");
});
};
});
})();
Upon loading, the select options are correctly initialized with the data in the lookupLists object, and when the user changes the selected option, the ng-change directive successfully triggers the populateLookup function, which successfully populates the lookups.columns object. The problem is that I'm having difficulty binding the lookups.columns object with my ng-repeat directive in my table. I've tried to reference the object using columns, lookups.columns, and permits.lookups.columns, yet I cannot seem to access it.
I tried to do something similar in my main controller, and after researching, I found that if I created a variable and assigned "this" to it, then referenced that variable when creating my object, it worked - my assumption is that the assignment of "this" effectively allows the function to assign objects in a scope outside of its own scope. I tried to do that here by creating lookups, but that doesn't seem to be helping here. I can see that lookups.columns is indeed created, but it is not in the $scope of the controller. I'm just learning AngularJS (please be gentle) and still trying to wrap my head around all the binding and scope limitations. I'm guessing that my answer is to build a service/factory and inject it, but when I try to do that based on all of the examples I've seen, it breaks the parts that I have working, so I come back to this starting point, where at least everything else works.

Answer 1

Perhaps you forget '$scope' in front of 'column' variable.
like this:
$scope.populateLookup = function(lookup) {
$http({
url : <some URL>
dataType : "json",
method : "POST",
data : "action=3&lookup="+lookup,
headers : {"Content-Type" : "application/x-www-form-urlencoded; charset=utf-8"}
}).success(function(data) {
if ( angular.isArray(data.columns)) {
$scope.columns = data.columns;
} else {
$scope.columns = [data.columns];
}
}).error(function(error){
alert("There was an error");
});
};