Używanie modeli szkieletowych z AngularJS

Question

Ostatnio zastanawiałem się nad różnicami i podobieństwami między Backbone.js i AngularJS.

To, co uważam za naprawdę wygodne w kręgosłupie to modele kręgosłupa i kolekcje kręgosłupa. Trzeba tylko ustawić urlRoot, a następnie komunikacja z serwerem zaplecza za pośrednictwem Ajax w zasadzie działa.

Czy nie powinno być możliwe stosowanie tylko modeli szkieletowych i kolekcji w aplikacji AngularJS? Mamy więc najlepsze dwukierunkowe wiązanie danych z AngularJS i wygodny dostęp do serwera (lub innych opcji pamięci masowych) za pośrednictwem modeli i kolekcji szkieletowych.

Szybkie wyszukiwanie w internecie nie spowodowało pojawienia się witryny sugerującej ten scenariusz użycia. Wszystkie zasoby mówią o używaniu jednej lub drugiej struktury.

Czy ktoś ma doświadczenie z używaniem modeli szkieletowych lub kolekcji z AngularJS. Czy nie będą się dobrze uzupełniać? Czy czegoś mi brakuje?

Answer 1

Prawidłowe pytanie na pewno.

Wiele ograniczeń z bieżącą implementacją zasobu $, który między innymi nie posiada wewnętrznego zarządzania kolekcjami, takiego jak Backbone.Collection. Po napisaniu własnej warstwy kolekcji/zarządzania zasobami w kanciastych (przy użyciu $ http, a nie zasobu $), teraz widzę, czy mogę zastąpić wiele elementów wewnętrznych dla kolekcjonowania szkieletów i modeli.

Do tej pory część pobierania i dodawania jest bezbłędna i zapisuje kod, ale powiązanie tych modeli szkieletowych (lub atrybutów wewnątrz, raczej) z modelami ng na wejściach do edycji jeszcze nie działa.

@ericclemmons (GitHub) uczynił to samo i mam dwa dobrze ożenić - Zapytam go, dostać moją pracę testową, a zakładać zawarcie ...

Answer 2

Zastanawiałem się, czy ktoś miał zrobił to również. W mojej najnowszej/pierwszej kanciastej aplikacji znalazłem Angulara, który ma dość brak modeli i kolekcji (chyba że coś mi oczywiście brakuje!). Oczywiście możesz pobierać dane z serwera za pomocą $ http lub $ resource, ale co jeśli chcesz dodać niestandardowe metody/właściwości do swoich modeli lub kolekcji. Załóżmy na przykład, że masz kolekcję samochodów i chcesz obliczyć całkowity koszt. Coś takiego:

z kolekcją Backbone, byłoby to dość łatwe do wdrożenia:

carCollection.getTotalCost() 

ale w kątowe, to prawdopodobnie masz zawinąć metodę niestandardową w służbie i przekazać swoją kolekcję to, tak:

carCollectionService.getTotalCost(carCollection) 

Podoba mi się podejście do kręgosłupa, ponieważ w moim odczuciu jest czystsze. Jednak uzyskanie dwukierunkowego powiązania danych jest trudne. Sprawdź ten przykład JSBin.

http://jsbin.com/ovowav/1/edit

Podczas edycji numerów, collection.totalCost przyzwyczajenie aktualizować ponieważ właściwości car.cost nie dostają ustawić poprzez model.set().

Zamiast tego, zasadniczo użyłem swoich własnych konstruktorów/"klas" dla modeli i kolekcji, skopiowałem podzbiór API szkieletu z Backbone.Model and Backbone.Kolekcja i zmodyfikował moje niestandardowe konstruktory/klasy, aby działała z powiązaniem danych Angular.

Answer 3

grupę roboczą wiążące dla powyższego przykładu ... http://jsbin.com/ivumuz/2/edit

to pokazuje drogę do pracy około Szkieletowymi Modele z angularjs. ale połączenie seterów/pobierających byłoby lepsze.

Answer 4

Spróbuj rzucić okiem na restangular.

Nigdzie go nie wdrożyłem, ale kilka dni temu widziałem rozmowę. Wydaje się, że rozwiązuje ten sam problem w sposób kątowy.

wideo: http://www.youtube.com/watch?v=eGrpnt2VQ3s

Answer 5

miał podobny pomysł w głowie i wpadł na ten pomysł: Dodaj tylko getter i setter na zawsze modelu atrybutu.

Backbone.ngModel = Backbone.Model.extend({ 
     initialize: function (opt) { 
     _.each(opt, function (value, key) { 
      Object.defineProperty(this, key, { 
       get: function() { 
        return this.get(key) 
        }, 
       set: function (value) { 
        this.set(key, value); 
       }, 
       enumerable: true, 
       configurable: true 
      }); 
     }, this); 
    } 
}); 

Zobacz skrzypce: http://jsfiddle.net/HszLj/

Answer 6

Zastanawiałem się o takim samym

Jest to use-case:

Salesforce mobilnych SDK (hybrydowe) jest funkcja o nazwie smartstore/SmartSync , który oczekuje modeli szkieletowych/kolekcji, które zostaną zapisane w pamięci lokalnej w celu uzyskania dostępu w trybie offline.

Zgadłeś, że to prawda, chcemy użyć angularjs dla reszty aplikacji hybrydowej.

Ważne pytanie.

-Sree

Answer 7

Należy spojrzeć na boilerplate angularjs z parse here. Parse ma szkielet, ale nie jest dokładnie kręgosłupem. Ów, gdzie im rozpoczynające mój pomysł projektu angularjs backbone.js