Angular2调用ASP.NET Web API [英] Angular2 calling ASP.NET Web API
本文介绍了Angular2调用ASP.NET Web API的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我是Angular/Angular2的新手，也许我涉水太深了....但是我正尝试使用angular显示来自Web API控制器的结果... 到目前为止，我有:
I'm a total newbie to Angular/Angular2, and maybe I'm getting into too deep water.... but I'm trying to display the result from a Web API controller using angular... So far I have:
boot.ts:
import {bootstrap} from 'angular2/platform/browser'
import {HTTP_PROVIDERS} from 'angular2/http'
import {AppComponent} from './app'
bootstrap(AppComponent, [HTTP_PROVIDERS]);
app.ts:
import {Component} from 'angular2/core';
import {Http} from 'angular2/http';
@Component({
selector: 'my-app',
template: '{{title}}'
})
export class AppComponent {
http: Http;
public title;
constructor(http: Http) {
this.title = 'Loading list';
this.http = http;
}
}
index.html:
index.html:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Angular 2 with ASP.NET 5</title>
<link href="libs/css/bootstrap.css" rel="stylesheet"/>
<!-- 1. Load libraries -->
<script src="libs/es6-shim.min.js"></script>
<script src="libs/system-polyfills.js"></script>
<script src="libs/shims_for_IE.js"></script>
<script src="libs/angular2-polyfills.js"></script>
<script src="libs/system.js"></script>
<script src="libs/rx.js"></script>
<script src="libs/angular2.dev.js"></script>
<script src="libs/http.dev.js"></script>
<!-- 2. Configure SystemJS -->
<script>
System.config({
packages: {
appScripts: {
defaultExtension: 'js'
}
}
});
</script>
<script>
System.import('appScripts/boot')
.then(null, console.error.bind(console));
</script>
</head>
<body>
<h2>Device list 1</h2>
<my-app>Loading...</my-app>
</body>
</html>
DeciveController.cs
DeciveController.cs
[Route("[controller]")]
public class DevicesController
{
[HttpGet]
public object Get()
{
return new[] { new { id= "1", name = "Raspberry 1" },
new {id="2", name = "Raspberry 2" }};
}
}
但是我不知道如何调用控制器....
but I can't figure out how to call the controller....
任何帮助将不胜感激...
Any help would be greatly appreciated...
推荐答案
我向您展示的是未使用任何外部服务的情况.稍后，当您移动时，您将了解Angular2中的服务.
I'm showing you without using any external service. later as you move, you will learn what service is in Angular2.
import {Observable} from 'rxjs/Observable';
import 'rxjs/Rx';
export class AppComponent {
http: Http;
public title;
constructor(http: Http) {
this.title = 'Loading list';
this.http = http;
this.url='/api/Devices';
this.http.get(this.url)
.map(response => response.json())
.subscribe((res) =>{
this.obj=res;
console.log(this.obj);
},
(err)=>console.log(err),
()=>console.log("Done")
);
}
}
这篇关于Angular2调用ASP.NET Web API的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
