Angular 2 + Web API [英] Angular 2 + web api

问题描述

我已经完成了《英雄之旅》教程，效果很好.

I've worked on the Tour of Heroes tutorial,works perfectly well.

我已经使用C#作为小型后端制作了一个Web api，以进行进一步测试.当我尝试加入所说的后端时，即使下一个选项卡在完全相同的路径上，angular也会返回未找到错误404.

I've made a Web api with C# as a small backend to test further. When I try to join said back-end, angular returns an error 404 not found, even when next tab is on the exact same road.

这是错误:

 An error occurred Object { _body: Object, status: 404, ok: false, statusText: "Not Found", headers: Object, type: null, url: "http://localhost:58225/api/Character" }

我尝试登录该呼叫的答案，我返回一个"[object Object]"，但我想那是错误消息本身.

I've tried login the answer of the call, I return an "[object Object]" , but I guess that's the error message itself.

@Injectable()
export class CharacterService{
private charactersUrl = 'http://localhost:58225/api/Character';

constructor(private http:Http){}

getCharacters(): Promise<Character[]>{
    alert("Getting Characters");

    var my_data = this.http.get(this.charactersUrl)
                    .toPromise()
                    .then(response => response.json().data)

    console.log("Resultat de l'appel = "+my_data);

    return this.http.get(this.charactersUrl)
        .toPromise()
        .then( (response => response.json().data as Character[]) )
        .catch(this.handleError);
}

如您所见，这里没有真正的原创内容.

As you can see there's nothing really original here.

/api/Character返回一个IEnumerable，其中包含我的字符列表.

The /api/Character returns an IEnumerable that contains the list of my characters.

public IEnumerable<string> GetAll()
    {
        List<Character> myCharacs = repo.Get().ToList();
        List<String> myJsonCharacs = new List<string>();
        foreach (var charac in myCharacs)
        {
            var cur = jsonConverter.Serialize(charac);
            myJsonCharacs.Add(cur);
        }

        return myJsonCharacs;

    }

我真的不知道该如何进一步测试?我正在阅读Promise和Observable，以查看是否错过了某些内容，但这是我能想到的最简单的示例:/

I don't really know how I'm supposed to test further ? I'm reading on promises and observables to see if I missed something, but this is the simplest example I could think of :/

我已按照以下步骤更改了JSON API的响应:

I have changed the response of the API for json by following this : How do I get ASP.NET Web API to return JSON instead of XML using Chrome?.

当我直接浏览到它时，API现在返回它:

The API now returns this when I browse directly to it :

 ["{\"characterName\":\"Azazel\",\"playerName\":\"Mulhouse\",\"game\":{\"name\":\"Call of Cthulhu\",\"BaseAttributes\":[{\"max\":18,\"value\":12,\"name\":\"appearance\"},{\"max\":18,\"value\":21,\"name\":\"constitution\"},{\"max\":18,\"value\":19,\"name\":\"strength\"},{\"max\":18,\"value\":17,\"name\":\"dexterity\"},{\"max\":18,\"value\":15,\"name\":\"power\"},{\"max\":18,\"value\":13,\"name\":\"size\"},{\"max\":18,\"value\":13,\"name\":\"intelligence\"},{\"max\":24,\"value\":12,\"name\":\"education\"}],.....

没有区别. (这是答案的一个示例，实际上要更长一些)

Made no difference. (This is a sample of the answer, it's actually way longer)

此外，由于答案是路径的404，因此我怀疑问题与答案的格式无关，而更多地是与angular的配置有关.我该如何检查?

Also, since the answer is a 404 to the path, I suspect the problem is not related to the format of the answer but more to angular's configuration. How could I check this?

对象结构之间的差异会导致此404错误吗?如果我来自服务器的json字符的字段比angular2中定义的json字符的字段更多，会发生什么?

EDIT : Could a difference between the structure of my objects cause this 404 error? If my json character coming from the server has more fields than the json character defined in angular2, what happens?

谢谢

推荐答案

一个朋友终于找到了答案:

A friend finally found the answer :

删除内存中数据服务引用.那东西阻止了HTTP请求.

REMOVE THE IN-MEMORY-DATA-SERVICE references. That thing blocks http requests.

我知道有一个不同的错误，但是至少我可以访问API.

I know have a different error, but at least I can reach the API.

这篇关于Angular 2 + Web API的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！