Menüelement per Berechtigung ausblenden mit AngularJS und Web-API

Question

Ich habe rollenbasierte Autorisierung in meinem Web API RESTfull-Service mit OWIN implementiert.

Was wäre der beste Weg, um Menüelemente oder Schaltflächen auf der Grundlage der Rolle, die der Benutzer hat, zu verbergen? Ich möchte die Elemente ausblenden, auf die der Benutzer keinen Zugriff hat.

AKTUALISIERT

ich, was die beste Praxis für meinen Controller wissen will, ist.

Dies ist ein Beispiel von dem, was ich will, aber ich denke nicht, dass es der richtige Weg ist, es zu tun. Zweitens schlägt das Routing fehl, da es nicht zwischen den beiden Aktionen unterscheiden kann.

[Authorize(Roles = "SomeRole")] 
public class FooController : ApiController 
{ 
    [HttpGet] 
    public string HelloWorld() 
    { 
     return "Hello world - you are authorized"; 
    } 

    [HttpGet] 
    [Route("hasaccess")] 
    [AllowAnonymous] 
    public bool HasAccess() 
    { 
     return User.IsInRole("SomeRole"); 
    } 
} 

http://localhost:8080/api/foo/ -> ruft Hello World()

http://localhost:8080/api/foo/hasaccess -> ruft HasAccess()

Answer 1

Sie ng-if-Direktive verwenden könnte. Es wird div nur dann rendern, wenn die Funktion hasRole true zurückgibt.

<div ng-if="hasRole('admin')"> 
        Admin menu item 
</div> 

Und dann in der Steuerung hat eine Funktion

$scope.hasRole = function(role){ 
    //check if user has needed Role 
    //return true or false 
}