AngularJS z ServiceStack/WebApi/MVC Akcje

Question

Jestem nowy w AngularJS i chcę go użyć do naszego nowego projektu opartego na ASPNET MVC. Chcę, aby AngularJS zarządzał widokami (będzie to hybrydowe SPA, niektóre strony normalnie generują widoki). Ale jestem w stanie zdecydować, co powinienem wybrać na końcu serwera. np. akcje ServiceStack/WebApi/MVC? W sieci dostępne są przykłady WebAPI i zwykłego ASPV MVC, ale nie można znaleźć żadnych przykładów z SS + Angular. Czy możesz podać przykładowy projekt z SS + Angular (jak zarządzać routingiem, uniemożliwić otwarcie widoków (plików html) bezpośrednio przez użytkownika itp.).

Answer 1

Kilka miesięcy wstecz I ułożyła Demo project (https://github.com/paaschpa/ordersDemo) do Chicago Code Camp 2013. Witryna próbka na AppHarbor wydaje się być w dół (Mam witrynę AppHarbor roboczy, ale wszyscy moi „configs produkcji” znajdują się w Repozytorium GitHub.Nie mogę uzyskać konfiguracji/ustawień między GitHubem a nimi), ale myślę, że kod przypomina to, o co prosisz. Używa AngularJS (prawdopodobnie nie najlepszego tego przykładu), .NET MVC w/ServiceStack hostowany w/api. Używa również Twitter BootStrap, Redis Pub/Sub i SignalR ... prawdopodobnie zniszczył zbyt wiele rzeczy w tym projekcie/przykładzie. Jeśli możesz zainstalować Redis (https://github.com/dmajkic/redis/downloads) i zmienić plik redisUrl na localhost:6379 w pliku web.config, powinieneś być w stanie uruchomić go lokalnie.

Answer 2

Czy tego właśnie chcesz?

https://github.com/Wintellect/Angular-MVC-Cookbook

Answer 3

Projekt SocialBootstrap zawiera przyzwoity pełna konfiguracja stos, wykorzystuje backbone.js & underscore.js nie kanciasty chociaż - może się to przyczynić do odczytania przez niego.

https://github.com/ServiceStack/SocialBootstrapApi

Chociaż w tym przykładzie warstwa usługa jest szczelnie połączony z przednim końcem, ponieważ są one oba w tym samym projekcie. Jest to coś, czego staram się unikać w przypadku większego SPA.

Answer 4

Używam ServiceStack + ASP.NET MVC + Angular w moim projekcie.

Po ServiceStack zainstalowany (dość łatwe z pakietem samorodek), zadzwoń ServiceStack Reszta WS jest bardzo proste z kątową w serwisie:

GetById: function (movieId) { 
    var url = root + 'api/movie/' + movieId; 
    var promise = $http({ method: 'GET', url: url }).then(function (response) { 
     return response.data; 
    }); 

    return promise; 
}, ... 

W ServiceStack używam DTO i ViewModel tak:

#region MovieDTO 
[Api("GET Movie by Id")] 
[Route("/movie/{Id}")] 
public class MovieDTORequest 
{ 
    public int Id { get; set; } 
} 

public class MovieDTOResponse 
{ 
    public MovieViewModel Movie{ get; set; } 
} 

#endregion 

I skończyć usługę:

private MovieBusiness _movieBusiness= (MovieBusiness)UnityHelper.BusinessResolve<Movie>(); 
public object Get(MovieDTORequest request) 
{ 
    Movie movie = _movieBusiness.GetById(request.Id); 
    MovieViewModel movieViewModel = MovieAdapter.ToViewModel(movie); 

    return new MovieDTOResponse { Movie = movieViewModel }; 
} 

dotyczących routingu, w moim c jak korzystać z trasy ASP.NET MVC, ponieważ jestem z nim bardziej komfortowo. Więc stworzyliśmy BaseController wysyłania ServiceStack Użytkownika do każdego Widok:

[ProfilingActionFilter] 
public class BaseController : ServiceStackController<CustomUserSession> 
{ 
    /// <summary> 
    /// Surcharge de l'action pour charger la notification dans le ViewBag s'il y en a une et l'a marquer comme delivrée 
    /// </summary> 
    protected override void OnActionExecuting(ActionExecutingContext filterContext) 
    { 
     base.OnActionExecuting(filterContext); 
     int Id = 0; 
     UserViewModel user= new UserViewModel(); 

     if (int.TryParse(base.UserSession.UserAuthId, out Id)) 
     { 
      user= new UserViewModel() 
      { 
       id = Convert.ToInt32(base.UserSession.UserAuthId), 
       nom = base.UserSession.DisplayName, 
       roles = base.UserSession.Roles != null ? string.Join(",", base.UserSession.Roles.ToArray()) : string.Empty 
      }; 
     } 
     ViewBag.User= user; 
    } 

Następny jeśli trzeba przejść ViewModel direcly do kątowego kontrolera można to zrobić:

@model AddictLive.Core.ViewModel.Mobile.ViewModels.MovieViewModel 
@using Newtonsoft.Json 

<div ng-controller="MovieController" ng-init="init(@Html.Raw(JsonConvert.SerializeObject(Model)))"> 
    ... 
</div> 

próbka init (metoda) w kątowym kontrolera:

$scope.init = function (movieViewModel) { 
    $scope.property1= movieViewModel.property1; 
    $scope.property2= movieViewModel.property2; 
}; 

I uproszczone wszystkie moje przykłady, aby łatwo zrozumieć, ale jeśli potrzebujesz więcej wyjaśnień daj mi znać

Answer 5

Robię SS + AngularJs + SignalR i mogę Ci powiedzieć, że nie żałuję tego, osobiście czuję, że to bardzo proste ramy mają na celu tylko użycie wtyczek i twojego IoC (w moim przypadku używam SimpleInjector).

Badałem kanciasty i SS separatelly od REST wzywa w kątowe można backend agnostykiem, ale trzeba jeszcze ustalić to takie rzeczy jak integrować bezpieczeństwo między przednim końcem i tylnym końcu, routingu itp

można znaleźć mała wersja demonstracyjna pod numerem razorRockstarts, która korzysta z funkcji SS + kątowe, możesz także sprawdzić ten post i ten other.

Mam nadzieję, że pomaga