>I would pre-define $scope.Observers at the top of the code. Otherwise Angular may not be monitoring the changes right away. IOW, define your model up front, otherwise the assignment may not be watched by Angular and so no data shows up.
>
>Also I would use the .success/.error syntax with HTTP services rather than promise .then syntax. It tends to be a little bit cleaner and again more inline with what common examples do (either works - just a style thing):
>
>
> ars.controller('observerController', ['$scope', '$log', 'observerService', function ($scope, $log, observerService) {
> $scope.observers = [];
>
> observerService.getObservers()
> .success(function(data) {
> $scope.observers = data;
> $log.debug(data);
> })
> .error( function(errorPl) {
> $log.error('failure loading observers', errorPl);
> });
> }]);
>>
>Note that doing this removes the data.data and replaces it with just the data being returned to the success method
>Not sure if pre-defining the $scope item will fix it but that's one thing to check.
>
>Also look into Controller As syntax which defines the model on the actual controller rather than on the $scope object (newer syntax). The new sytnax is the recommended way going forward.
>
>Finally - don't hardcode URLs. Set a property on the your $scope (or controller if you're using ControllerAs) to specify a base URL that can be adjusted at runtime. Better yet, try to use relative URLs in any $http() calls.
>
>+++ Rick ---
>
>>Ok, hopefully I can articulate this problem. I've been working on this for two days now and still don't see what I'm doing wrong.
>>
>>I have an asp.net 5 app using angular js. I have my angular app.js defined as such:
>>
>>
>>var ars;
>>
>>(function () {
>>
>>
>> ars = angular.module("ars", []);
>>
>> ars.controller("arsController", ['$scope', function ($scope) {
>> $scope.title = "ARS - Web Edition";
>> $scope.description = "The Avian Record System (ARS) is a professional web based engine for all of your birding needs.";
>> }]);
>>
>> ars.controller('observerController', ['$scope', '$log', 'observerService', function ($scope, $log, observerService) {
>> var promiseGet = observerService.getObservers();
>> promiseGet.then(function(data) {
>> $scope.Observers = data.data;
>> $log.debug(data.data);
>> },
>> function(errorPl) {
>> $log.error('failure loading observers', errorPl);
>> });
>> }]);
>>
>> ars.service("observerService", ['$http', function ($http) {
>> this.getObservers = function () {
>> return $http.get('http://localhost:52795/ArsDataService.svc/GetObservers');
>> }
>> }]);
>>})();
>>>>
>>I next route to the Observers Page in mvc which uses the following directive to kick off the web get...
>>
>>
>> <div class="panel-body" >
>> <b>Observers</b> - Here's where you make observers.
>> <p><p><a href="../ManagedData/Observer" style="float:right" ng-click="getObservers" class="btn btn-primary btn-sm">Manage observers »</a></p></p>
>> </div>
>>
>>
>>If you look at the observercontroller in app.js, I can see the log in developer tools containing the results from the webget.. it is showing me the json:
>>
>>
>>- <ArrayOfObserver xmlns="http://schemas.datacontract.org/2004/07/ArsBrderWebDataService" xmlns:i="http://www.w3.org/2001/XMLSchema-instance">
>>- <Observer>
>> <FK_UserAccount>1</FK_UserAccount>
>> <Name>jbaird</Name>
>> <PK_Observer>1</PK_Observer>
>> <Principal>true</Principal>
>> </Observer>
>>- <Observer>
>> <FK_UserAccount>1</FK_UserAccount>
>> <Name>rbaird</Name>
>> <PK_Observer>2</PK_Observer>
>> <Principal>false</Principal>
>> </Observer>
>> </ArrayOfObserver
>>
>>
>>So I know that the $scope.Observers is getting the right data.
>>
>>on the Observer.cshtml I have:
>>
>>
>>@{
>> ViewBag.Title = "Observer";
>>}
>>
>><h2>Observer</h2>
>>
>>
>>
>><div ng-controller="observerController">
>> {{ observers }}
>> </div>
>>
>>>>
>>However at this time Observers doesn't show in the render. Attached is the screen shot.
>>
>>Can anyone spot what i'm overlooking?
Thanks Rick, I appreciate your comments. I was able to solve the problem. It was return xml from the web service not JSON. I added ResponseFormat to the webget and it now works as assigned. Also, the "observers" needed to be "Observers".. :)
