I would like to ask some help because I don't know what the problem is in this case.
I have a simple MVC5 application where I want to use angular and restangular. When I load the page the angular controller will be executed but the server is not called. It is just a test method nothing else. The rest service (Webapi2) returns a simple json object.
If I call the webservice by using the browser or Fiddler2 then I get the result what I expect. According to Fiddler the result is json.
When I reload the page I got back nothing, only the promise object, I assume. According to Fiddler there is no server call that time. If I dump out the testResult object (see the TestService.js file below) it contains nothing and I see the there is a property fromServer and the value is false. I assume it indicates whether server communication happened or not.
I went through the restangular documentation but I haven't found anything in it which helps me to get over this case. It doesn't mean that the documentation is wrong. :) I don't know what is the problem.
The expected json:
{"Id":1,"Name":"Egyeske"}
The single html file (_layout.cshtml)
<!DOCTYPE html>
<html lang="en" ng-app="dilibApp">
<head>
<meta name="viewport" content="width=device-width" />
<title>@ViewBag.Title</title>
</head>
<body>
<div ng-controller="TestController">
Test value: {{testValue}}
</div>
<div>
@RenderBody()
</div>
<div>
<script type="text/javascript" src="~/Scripts/angular.js"></script>
<script type="text/javascript" src="~/Scripts/angular-route.js"></script>
<script type="text/javascript" src="~/Scripts/angular-resource.js"></script>
<script type="text/javascript" src="~/Scripts/restangular.js"></script>
<script type="text/javascript" src="~/Scripts/lodash.js"></script>
@* dilibApp module *@
<script type="text/javascript" src="~/Scripts/AngularModules/dilibApp/dilibApp.js"></script>
<script type="text/javascript" src="~/Scripts/AngularModules/dilibApp/Controllers/TestController.js"></script>
<script type="text/javascript" src="~/Scripts/AngularModules/dilibApp/Services/TestService.js"></script>
</div>
</body>
</html>
The dilibApp.js file:
'use strict';
var dilibApp = angular.module('dilibApp', ['restangular', 'ngRoute', 'ngResource']).
config(function (RestangularProvider)
{
RestangularProvider.setBaseUrl('http://dev.dilib.local/service/webapi/');
});
The TestController.js file:
'use strict';
dilibApp.controller('TestController', function ($scope, testService)
{
$scope.testValue = testService.get();
});
The TestService.js file:
'use strict';
dilibApp.factory('testService', function(Restangular) {
var testResult = Restangular.all('http://dev.dilib.local/service/webapi/test');
//console.log(Restangular);
//console.log(testResult);
return {
get: function() {
//console.log(testResult.one());
return testResult.one();
}
}
});
Restangular.all('link').getList();
Restangular.one('link').get();
So you should put the method .get()
after method .one()
to get single result or .getList()
to get a list of results