Modo preferito di creare collegamenti con backbone.js

Question

Sto provando a girarmi intorno a backbone.js ma lo trovo difficile a causa della mancanza di esempi (IMO).

Prima di tutto, qual è il modo migliore per ottenere un collegamento a un oggetto.
Se voglio ottenere l'url di modifica di un modello Album che potrei fare album.url() + '/edit', questo è davvero il modo migliore?

Inoltre, sto cercando di far funzionare la mia applicazione al 100% senza javascript quindi non voglio che i miei URL/link dicano /albums/#1/edit, voglio che sia /albums/1/edit e sovrascrivi questo in JS.

sto pensando creo URL normali e utilizzare jQuery.live chiamare router.navigate in backbone.js
non ho mai avuto questo lavoro però, quando chiamo router.navigate('/albums/2', true) l'URL cambia, ma il mio spettacolo azione non viene mai chiamato. Se aggiorno viene chiamato così la rotta è abbinata.

Cosa mi manca?

Answer 1

La risposta di base, che è un po 'frustrante, è "non c'è modo preferito!". Backbone.js non ti dice come impostare i collegamenti, puoi farlo come più ti piace. Ho trovato questa flessibilità altrettanto fastidiosa di te, almeno all'inizio.

Quindi, ecco il modo in cui sto avvicinando questo su my current project, con il (grande) avvertenza che questo è solo uno dei tanti modi per fare le cose in Backbone:

• Per la maggior parte, io don usare i collegamenti reali Non c'è una ragione esplicita per non farlo, ma significa che devi tenere traccia di un gruppo di stringhe URL che devono essere coerenti. Preferisco mantenere tutta la formattazione dell'URL nei miei router e non occuparmene altrove.

• Per aprire una nuova vista "di primo livello", come una schermata di modifica, imposto qualcosa che attiva un evento. Nell'applicazione in cui sto lavorando, ho un modello di stato globale e per aprire una nuova vista chiamo state.set({ topview: MyTopView }). Ciò causa l'oggetto state per l'attivazione di change:topview.

• Qualsiasi parte dell'interfaccia utente che deve essere modificata quando la vista di livello superiore cambia ha un metodo di aggiornamento associato a change:topview. Quando l'evento si attiva, guardano a state.get('topview') e aggiornano se necessario.

• Trovo i miei router solo come parti marginalmente specializzate dell'interfaccia utente - sono essenzialmente viste che vengono visualizzate nella barra degli indirizzi del browser, anziché nella finestra. Come altre visualizzazioni, aggiornano l'oggetto state sugli eventi dell'interfaccia utente (ad esempio un nuovo URL) e, come altre visualizzazioni, ascoltano l'oggetto state per le modifiche che causano l'aggiornamento. La logica che la schermata di modifica ha l'URL albums/<albumid>/edit è completamente incapsulata nel router e non mi riferisco ad essa da nessun'altra parte.

Questo funziona bene per me, ma aggiunge un modello completamente nuovo, l'oggetto Stato globale, alla struttura Backbone, così ho difficilmente può chiamare questo l'approccio "preferito".

Aggiornamento: Si noti inoltre che .url(), nell'idioma Backbone, si riferisce alla URL del modello nella back-end API, non l'URL front-end (non è come Django di get_absolute_url).Non esiste alcun metodo nell'impostazione di Backbone predefinita che fornisce un URL rivolto all'utente per il tuo modello: dovresti scrivere tu stesso.

Answer 2

Inoltre, sto cercando di far funzionare la mia applicazione al 100% senza javascript; quindi non voglio che i miei URL/link dicano /albums/#1/edit, voglio che sia /albums/1/edit e sovrascrivi questo in JS.

si può fare esattamente questo w/pushState. basta attivarlo nella chiamata Backbone.history.start:

Backbone.history.start({pushState: true})

questo dice Backbone utilizzare l'API HTML5 Storia (anche noto come "pushState"), che utilizza URL completi esattamente come hai intenzione.

leggere sulla storia api qui: http://diveintohtml5.ep.io/history.html

e ho scritto una serie 2 parte sull'uso pushState w/la seconda parte si concentra sulla progressive enhancement in spina dorsale, a fare quello che stai bisogno:

http://lostechies.com/derickbailey/2011/09/26/seo-and-accessibility-with-html5-pushstate-part-1-introducing-pushstate/

e

http://lostechies.com/derickbailey/2011/09/26/seo-and-accessibility-with-html5-pushstate-part-2-progressive-enhancement-with-backbone-js/

speranza esimo Aiuti :)