Ci scusiamo per la domanda stupida, tutti sanno come iniziare a utilizzare AngularUI? L'ho scaricato da Github e ho letto le istruzioni in README, ma ancora non capisco cosa devo fare.Come integrare AngularUI in AngularJS?
misure per integrare:
build)ui.directives o ui.filters a seconda di cosa si prevede di utilizzare).La maggior parte dei passaggi descritti include solo le dipendenze JS/CSS. L'unica parte "difficile" è quello di dichiarare le dipendenze su un ui * modulo, è possibile fare in questo modo:.
var myApp = angular.module('myApp',['ui.directives']);
Una volta che tutte le dipendenze sono inclusi e un modulo di configurazione si è pronti ad andare. Ad esempio, utilizzando la direttiva ui-data è così semplice come (si noti la ui-date):
<input name="dateField" ng-model="date" ui-date>
Ecco la completa jsFiddle che mostra come utilizzare la direttiva ui-Data: http://jsfiddle.net/r7UJ2/11/
Si potrebbe anche voler per dare un'occhiata alle fonti dello http://angular-ui.github.com/ dove ci sono esempi dal vivo di tutte le direttive.
Penso che i plug-in siano mancanti: devi aggiungere gli script del plugin jQuery e il css per far funzionare alcune direttive angolari-ui. Ad esempio la direttiva CodeMirror ha bisogno:
<script src="http://codemirror.net/lib/codemirror.js" type="text/javascript"></script>
<script src="http://codemirror.net/lib/util/runmode.js" type="text/javascript"></script>
<link rel="stylesheet" href="http://codemirror.net/lib/codemirror.css" type="text/css" />
E 'una sorpresa per me che angular-ui.github.com non menziona la necessità di includere i plugin.
Perché il downvote? Questa è un'informazione rilevante ... – spracketchip
Ciao Ho scritto un articolo specifico su come eseguire questa operazione per l'evidenziazione della sintassi di PHP. L'articolo è qui: http://neverstopbuilding.net/how-to-integrate-codemirror-with-angular-ui/
Il nucleo delle cose sta ottenendo il diritto di configurazione:
var myApp = angular.module('myApp', ['ui']);
myApp.value('ui.config', {
codemirror: {
mode: 'text/x-php',
lineNumbers: true,
matchBrackets: true
}
});
function codeCtrl($scope) {
$scope.code = '<?php echo "Hello World"; ?>';
}
Per qualcosa di simile al seguente frammento di codice HTML:
<div ng-app="myApp">
<div ng-controller="codeCtrl">
<textarea ui-codemirror ng-model="code"></textarea>
</div>
</div>
si può vedere l'intera jsfiddle del impostare qui: http://jsfiddle.net/jrobertfox/RHLfG/2/
pkozlowski.opensource è giusto, ci sono molti più file che è necessario includere di esso sembra dalla documentazione AngularUI (se è possibile chiamarlo documentazione ...)
Comunque spero che questo sia utile a voi o ad altri.
+1 per avermi fatto capire che stavo iniettando il modulo sbagliato. Stavo installando 'angular-ui' tramite bower e cercando di iniettare 'ui.bootstrap'. Due cose separate. – saiyancoder
A partire dal 3 maggio 2013, ecco i passaggi:
includono
<script src="angular.min.js"></script>
<script src="ui-bootstrap-tpls-0.3.0.min.js"></script>
registro ui
angular.module('myFancyApp', ['ui.bootstrap']);
assicurarsi myFancyApp è lo stesso come nel vostro <html ng-app="myFancyApp">
Inizia la magia.
A partire da ora, utilizzare twitter-boostrap-css v2.3.1 o qualcosa di simile e non v3. – SunnyRed
Sono un po 'confuso qui. angular-ui-bootstrap e angular-ui sono due diversi progetti –
Le istruzioni sono nel file readme.md al loro repository github ufficiale
In alternativa, il modo in cui si può scoprire come integrare è quello di aprire il file js angolare-ui (ad esempio: ui-bootstrap-TPLS-0.6.0.js) e nella prima riga, si noterà la seguente dichiarazione
angular.module("ui.bootstrap", [...deps...])
sulla base del codice di cui sopra, è necessario iniettare 'ui.bootstrap' nel vostro modulo.
angular.module('myFancyApp', ['ui.bootstrap','other_deps',.....]);
queste sono istruzioni per [Angular UI * Bootstrap *] (https://github.com/angular-ui/bootstrap) –
Grande risposta e grazie per la pubblicazione il link al http://angular-ui.github.com/ –
In realtà, il punto 1 è opzionale a seconda di quello che si usa direttive e il punto 5 è solo scorretto come solo tra cui ' ui.directives' genererà errori quando si fa riferimento a 'ui.config'. Invece, dovresti sempre includere 'ui' e rimuovere solo le direttive/i filtri che non vuoi. – ProLoser
Hmm, se non sbaglio il passaggio 5 è corretto in quanto entrambi 'ui.directives' e' ui.filters' hanno la dipendenza dal modulo 'ui.config'. Ma certo, potrebbe solo menzionare il modulo 'ui'. –