Angularjs + Zurb Foundation, giocano bene insieme?

Question

Ho difficoltà a configurare un progetto con angolare e fondazione 3 (binari nel back-end). Quindi ho cercato molto ma non ci sono molti risultati.

che sto servendo angolare da una sottocartella (localhost: 3000/app), e ha iniziato il codice HTML simile a questo

!!!5 
%html{ "ng-app" => "App" } 
    %head 
    -# I tried this for html5 url on angular, not so much help so far 
     %base{:href => "/app/"} 
    %title 
     NG APP 
     ... 
    %body 
    %header 
     ... 
    %main 
     = yield 
    %footer 
     ... 
    = javascript_include_tag "application" 
    = yield :javascripts 

Un paio di vista funzionano bene. Ma quando ho provato a usare la scheda delle basi, ho potuto fare il lavoro, perché l'angolare passa l'ancora come url che deve essere controllato contro $ routeProvider.

Quindi, controllo qualche domanda qui, e parte delle risposte mi danno l'impressione che le fondamenta funzionino bene abilitando la modalità html5 in angolare. (Che potrei farcela) e altre risposte dicono che per rendere il lavoro di base con angolare dovrebbe scrivere una direttiva per ogni componente sulla fondazione. O l'ultimo caso si sta spostando su Twitter Bootstrap.

Quindi, posso trovare una risposta unificata, potresti per favore, confermare se in questo momento posso usare la fondazione con angolare in modo diretto. Grazie.

Answer 1

La scelta migliore sarebbe avvolgere i plugin Foundation in servizi angolari o utilizzare solo CSS/SASS forniti con il framework e ricreare il comportamento da zero. Concentrati sulla prototipazione usando markup + fogli di stile e poi crea la logica in modo angolare. Almeno, questo è quello che farei se dovessi/dovessi usare la Fondazione.

Twitter Bootstrap funziona in modo simile e l'unico vantaggio del passaggio a questo framework è il fatto che è possibile trovare numerosi moduli/direttive angolari che includono i plug-in disponibili. In questo caso non dovresti fare lo stesso lavoro due volte e bene.

1. Dai un'occhiata qui: http://mgcrea.github.io/angular-strap/ in primo luogo.
2. quindi cercare i componenti di bootstrap basata Bower.io Components Directory

Inoltre, come alcune persone nei commenti hanno detto, potrebbe essere necessario il bootstrap voi l'applicazione manualmente, che è così semplice come si avvolgendo applicazione in un modulo e in esecuzione:

angular.bootstrap(element[, modules]); 

// http://docs.angularjs.org/api/angular.bootstrap 

Come ho già detto, di solito è meglio non reinventare la ruota.

Edit:

C'è una interessante discussione su Google Gruppi per quanto riguarda questo argomento (e non sorprende conclusioni degli utenti sono molto simili): https://groups.google.com/d/msg/angular/Htkzt7Fsaog/TeFm5l4snTwJ

Answer 2

È possibile utilizzare la libreria angolare-ui-fondamento su GitHub , la sua probabilmente il posto migliore da cui partire,

https://github.com/mhayes/angular-ui-foundation

Answer 3

Ecco un adattamento quasi completa della Componenti Bootstrap UI angolari per il Foundation CSS: http://madmimi.github.io/angular-foundation/.