1. Html
<!DOCTYPE html>
<html ng-app="ApiApp">
<head>
<title></title>
<meta charset="utf-8" />
<script src="scripts/angular.min.js"></script>
</head>
<body ng-controller="ApiCtrl">
<p>Welcome</p>
<p ng-repeat="data in Data">
{{data.id}}-{{data.Name}}-{{data.address}}
</p>
<script type="text/javascript">
var app = angular.module("ApiApp", [])
.controller("ApiCtrl", function ($scope, $http) {
//$http.get("http://localhost:53083/api/data/getdata") applicable
//$http.get("api/data/getdata") applicable
$http.get("/api/data/getdata")
.then(function (apiResponse) {
console.log(apiResponse);
$scope.Data = apiResponse.data;
})
})
</script>
</body>
</html>
2. Web Api Controller
[RoutePrefix("api/data")]
public class DemoApiController : ApiController
{
[Route("getdata")]
public List<info> GetData()
{
var data = new List<info>();
data.Add(new info {id=1,Name="Rinkesh",address="Rupbas",mobile="87987798778" });
data.Add(new info { id = 2, Name = "Kusum", address = "Agra", mobile = "555555555" });
data.Add(new info { id = 3, Name = "Darsika", address = "Agra", mobile = "66666666" });
data.Add(new info { id = 4, Name = "Vihan", address = "Agra", mobile = "88888888888" });
return data;
}
}
3. Model
public class info
{
public int id { get; set; }
public string Name { get; set; }
public string address { get; set; }
public string mobile { get; set; }
}
4. Angular Js File
Angular Js File
<!DOCTYPE html>
<html ng-app="ApiApp">
<head>
<title></title>
<meta charset="utf-8" />
<script src="scripts/angular.min.js"></script>
</head>
<body ng-controller="ApiCtrl">
<p>Welcome</p>
<p ng-repeat="data in Data">
{{data.id}}-{{data.Name}}-{{data.address}}
</p>
<script type="text/javascript">
var app = angular.module("ApiApp", [])
.controller("ApiCtrl", function ($scope, $http) {
//$http.get("http://localhost:53083/api/data/getdata") applicable
//$http.get("api/data/getdata") applicable
$http.get("/api/data/getdata")
.then(function (apiResponse) {
console.log(apiResponse);
$scope.Data = apiResponse.data;
})
})
</script>
</body>
</html>
2. Web Api Controller
[RoutePrefix("api/data")]
public class DemoApiController : ApiController
{
[Route("getdata")]
public List<info> GetData()
{
var data = new List<info>();
data.Add(new info {id=1,Name="Rinkesh",address="Rupbas",mobile="87987798778" });
data.Add(new info { id = 2, Name = "Kusum", address = "Agra", mobile = "555555555" });
data.Add(new info { id = 3, Name = "Darsika", address = "Agra", mobile = "66666666" });
data.Add(new info { id = 4, Name = "Vihan", address = "Agra", mobile = "88888888888" });
return data;
}
}
3. Model
public class info
{
public int id { get; set; }
public string Name { get; set; }
public string address { get; set; }
public string mobile { get; set; }
}
4. Angular Js File
Angular Js File
No comments:
Post a Comment