2016-03-31 4 views
1

Ich lerne nur, wie Web API mit eckigen zu verwenden, aber ich habe ein paar Probleme beim Abrufen von Daten und ich würde es schätzen, wenn mir jemand helfen könnte.Was ist der beste Weg zum Abrufen von Daten mit Web API 2 und AngularJS

Ich habe einen Controller namens GetUserController mit den folgenden Methoden.

public class GetUserController : ApiController 
    { 
     [HttpGet] 
     public string GetUserName() 
     { 
      var user = "John Doe" 
      return user; 
     } 


     [HttpGet] 
     public string GetUserName2() 
     { 
      string user = "Jane Doe"; 
      return user; 
     } 

    } 

//Angular side of things 
    function getUser() { 
      return $http.get('/api/GetUser').then(function (data) { 
       return data; 

      }); 
     } 

Der obige Code funktioniert gut und und gibt den ersten Benutzer von der Steuerung. aber wenn ich versuche, die zweite zu erhalten, indem die unten Winkel Code verwendet:

function getUser() { 
     return $http.get('/api/GetUser/GetUserName2').then(function (data) { 
      return data; 

     }); 
    } 

Dies funktioniert nicht aus irgendeinem Grund sagt er nicht die GetUserName2 Methode finden können. Fehle ich etwas? Bitte helfen Sie?

EDIT: Der Fehler, den ich bin immer ist: Mehrere Aktionen wurden gefunden, die der Anforderung entsprechen

+0

Ich nehme an, Sie verwenden MVC 5 ?? – shammelburg

+0

Ja, ich benutze mvc 5 – 1future

Antwort

1

Dies verursacht, weil es keine echte RESTful Aufruf, die HTTP-Verben verwenden ist, GET, POST, PUT, DELETE.

Die Möglichkeit, Ihren Code zum Laufen zu bringen, besteht darin, die Datei WebApiConfig.cs zu ändern.

Von:

config.Routes.MapHttpRoute(
    name: "DefaultApi", 
    routeTemplate: "api/{controller}/{id}", 
    defaults: new { id = RouteParameter.Optional } 
); 

An:

config.Routes.MapHttpRoute(
    name: "DefaultApi", 
    routeTemplate: "api/{controller}/{action}/{id}", 
    defaults: new { id = RouteParameter.Optional } 
); 

Wie Sie sehen, wir haben die {action} zum routeTemplate hinzugefügt, die diese sehr ähnlich wie ein MVC-Controller macht.

Dies ermöglicht es Ihnen, Ihre API-Methoden (GetUserName & GetUserName2) Namen wie Sie versuchen, in Ihre angular $ http-Funktion zu tun.

Beispiel:

return $http.get('/api/GetUser/GetUserName') 
return $http.get('/api/GetUser/GetUserName2') 
+0

Und Sie Sir ist ein Genie .. Arbeitete wie ein Charme. Danke .. und danke für die Erklärung. Das hätte ich nicht vermutet. – 1future

2

Wie @shammelburg bemerkt hat, ist dies als Folge der Web.API nicht in der Lage, Ihre Anfrage an einen Controller/Verfahren anzupassen.

Es ist nicht so sehr, dass es nicht RESTful ist, und hat nichts mit dem Verb zu tun, das Sie verwenden ... es wurde nur eine passende Routemap nicht gefunden.

Per Antwort akzeptieren, können Sie eine andere generische Routenkarte fügen Sie das Verfahren für den Zugang zu ermöglichen, Sie versuchen jedoch eine spezifischere Option existiert Attribut-Routing: -

public class GetUserController : ApiController 
{ 
    [Route("api/getuser")] 
    [HttpGet] 
    public string GetUserName() 
    { 
     var user = "John Doe" 
     return user; 
    } 

    [Route("api/getuser/getusername2")] 
    [HttpGet] 
    public string GetUserName2() 
    { 
     string user = "Jane Doe"; 
     return user; 
    } 
} 

Und die Verwendung zu ermöglichen, Attribut Routen, fügen Sie diese zu Ihrer WebApiConfig Klasse: -

config.MapHttpAttributeRoutes(); 

diese Methode ermöglicht die Einrichtung von spezifischer individuellen Zuordnungen von URLs zu controllers/Methoden an der einzelnen Verfahrensebene, ohne eine globale Routenkarte machen zu müssen, die in Konflikt stehen könnten mit so sonst in Ihrer Anwendung zu einem späteren Zeitpunkt.

Sie weitere Informationen über Attribut finden here

Während die oben Routing wird das spezifische Problem beheben Sie haben, es in der Praxis wäre eine andere Art und Weise sein, um das Beispiel zu implementieren Sie haben: -

public class GetUserController : ApiController 
{ 
    [Route("api/user/{id}")] 
    [HttpGet] 
    public string GetUserName(int id) 
    { 
     // this would be replaced with some sort of data lookup... 
     var user = "unknown"; 

     if (id == 1) { 
      user = "John Doe"; 
     } else if (id == 2) { 
      user = "Jane Doe"; 
     } // and so on... 

     return user; 
    } 
} 

In dem oben genannten, die URL wo x ist eine Zahl, z api/user/1 entspricht der GetUserName Methode des GetUserController und übergibt die Nummer als Argument an die Methode.

Dieses zugegriffen würde mit so etwas wie dies in Eckig: -

function getUser(id) { 
    return $http.get('/api/user/' + id).then(function (data) { 
     return data; 
    }); 
} 
+0

Vielen Dank für die Erklärung, ich schätze es wirklich sehr! Ich denke auch, dass die Verwendung der von Ihnen bereitgestellten Lösung der beste Weg ist, um mein Projekt zu entwickeln, wenn es größer wird. Danke – 1future

Verwandte Themen