Entschuldigung für die dumme Frage, weiß jeder, wie man AngularUI benutzt? Ich habe es von Github heruntergeladen und die Anleitung in README gelesen, verstehe aber immer noch nicht, was ich tun muss.
Integrationsschritte:
buildOrdner gehostet ).ui.directivesoder ui.filtersje nachdem, was Sie verwenden möchten).Bei den meisten der beschriebenen Schritte geht es lediglich darum, JS / CSS-Abhängigkeiten einzuschließen. Der einzige "knifflige" Teil besteht darin, Abhängigkeiten von einem UI. * -Modul zu deklarieren. Sie können dies folgendermaßen tun:
var myApp = angular.module('myApp',['ui.directives']);
Sobald alle Abhängigkeiten enthalten und ein Modul konfiguriert sind, können Sie loslegen. Zum Beispiel ist die Verwendung der UI-Date-Direktive so einfach wie (beachten Sie die ui-date):
<input name="dateField" ng-model="date" ui-date>
Hier ist die vollständige jsFiddle, die zeigt, wie die UI-Date-Direktive verwendet wird: http://jsfiddle.net/r7UJ2/11/
Vielleicht möchten Sie auch einen Blick auf die Quellen von http://angular-ui.github.com/ werfen, wo es Live-Beispiele aller Richtlinien gibt.
ui.directivesFehler auslöst, wenn daraufui.configverwiesen wird. Stattdessen sollten Sie immeruidie Anweisungen / Filter einschließen und einfach entfernen, die Sie nicht möchten.ui.directivesundui.filtersAbhängigkeit vomui.configModul haben. Aber sicher, es konnte nur dasuiModul erwähnt werden.Ab dem 3. Mai 2013 sind hier die Schritte:
einschließen
<script src="angular.min.js"></script> <script src="ui-bootstrap-tpls-0.3.0.min.js"></script>registriere ui
angular.module('myFancyApp', ['ui.bootstrap']);Stellen Sie sicher, dass
myFancyAppes das gleiche ist wie in Ihrem<html ng-app="myFancyApp">Lass die Magie beginnen.
quelle
Ich denke, was fehlt, sind Plugins - Sie müssen die JQuery-Plugin-Skripte und CSS hinzufügen, damit einige Angular-UI-Anweisungen funktionieren. Zum Beispiel benötigt die Codemirror-Direktive:
<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" />Es ist eine Überraschung für mich, dass angular-ui.github.com nicht erwähnt, dass Plugins enthalten sein müssen.
quelle
Hallo, ich habe einen Artikel speziell darüber geschrieben, wie dies für die Hervorhebung der PHP-Syntax gemacht wird. Der Artikel ist hier: http://neverstopbuilding.net/how-to-integrate-codemirror-with-angular-ui/
Der Kern der Dinge ist die richtige Konfiguration:
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"; ?>'; }Für so etwas wie das folgende HTML-Snippet:
<div ng-app="myApp"> <div ng-controller="codeCtrl"> <textarea ui-codemirror ng-model="code"></textarea> </div> </div>Sie können die gesamte jsfiddle des Setups hier sehen: http://jsfiddle.net/jrobertfox/RHLfG/2/
pkozlowski.opensource ist richtig, es gibt viel mehr Dateien, die Sie einschließen müssen, als es aus der AngularUI-Dokumentation hervorgeht (wenn Sie es Dokumentation nennen können ...)
Wie auch immer, ich hoffe, das ist hilfreich für Sie oder andere.
quelle
Die Anweisungen befinden sich in der Datei readme.md in ihrem offiziellen Github-Repository
Angular UI
Alternativ können Sie herausfinden, wie Sie integrieren können, indem Sie die Datei angle-ui js öffnen (Beispiel: ui-bootstrap-tpls-0.6.0.js). In der ersten Zeile wird die folgende Anweisung angezeigt
angular.module("ui.bootstrap", [...deps...])Basierend auf dem obigen Code müssen Sie 'ui.bootstrap' in Ihr Modul einfügen.
angular.module('myFancyApp', ['ui.bootstrap','other_deps',.....]);quelle