My current controller setup is as follows:
app.controller('myController', function ($scope, myService) {
$scope.pageData = {};
myService.promiseGetDataFromServer()
.then(function (response) {
$scope.pageData = response.data;
}, function (reason) {
// error has occurred.. etc...
});
}
While everything is functioning correctly up to this point, I have encountered an issue where I want to populate $scope.pageData based on specific logic. I attempted the following approach:
app.controller('myController', function ($scope, myService2, thing) {
$scope.pageData = {}
switch (thing)
{
case 'whatever':
myService2.promiseGetWhateverFromServer()
.then(function (response) {
$scope.pageData = response.data;
}, function (reason) {
// error has occurred.. etc...
});
break;
case 'something':
myService2.promiseGetSomethingFromServer()
.then(function (response) {
$scope.pageData = response.data;
}, function (reason) {
// error has occurred.. etc...
});
break;
}
}
Although there were no server errors and the response was logged successfully, the view did not render as expected. This could be due to the properties of $scope.pageData being undefined.
How can I address this issue? I want the view to render only after the switch statement has executed successfully.