Hello everyone
I just have started to discover the world of web technologies. So I tried html5 with AngularJS. It is very nice, particularly the data binding, unfortunately I cannot get trough how to get the mistery of $http.get method. I tried many forms of calling it, but I could not get any data from my WebApi service. Here is my client side, the html code, and the js:
<!DOCTYPE html>
<html ng-app="MyApp">
<head>
<link rel="stylesheet" href="css/bootstrap.min.css">
<script src="http://buas011/angular.min.js"></script>
<script type="text/javascript">
var app = angular.module("MyApp", []);
app.controller("HelloController", function ($scope, $http) {
$scope.getData = function () {
$scope.text = "clicked";
try {
$http({ method: 'GET', url: 'http://localhost:53159/api/search', params: { id: '5' }
}).success(function (data, status, headers, config) {
$scope.text = "Data!";
}).
error(function (data, status, headers, config) {
$scope.text = "Unsuccess " + data + " " + status;
});
} catch (e) {
$scope.text = "Errorr! " + e;
}
}
})
</script>
</head>
<body ng-controller="HelloController">
<p>Hello {{text}}</p>
<input type="text" ng-model="text" >
<form ng-submit="getData()" >
<input type="submit" value="Get data" class="btn btn-info">
</form>
</html>
On the webapi side I use this code:
public class SearchController : ApiController
{
public string Get(int id)
{
return "userid: " + id+1;
}
}
If I use link in webbrowser for the GET, it works (http://localhost:53159/api/search/5" ) but from the website I always run to the error method.
Thanks for reading this, and thanks in advance!
Greetings Adam!