Implementierung Bootstrap Angular toggle

Ich bin neu in Angular, und habe versucht, die Bootstrap Angular toggle Funktion/Modul auf meiner Website zu implementieren.Implementierung Bootstrap Angular toggle

Es gibt Dokumentation auf der verknüpften Website, aber vollständige Arbeitsbeispiele (z. B. kleine unabhängige Geigen) sind nirgends zu finden. Ich kann diese Funktion nicht bekommen überhaupt arbeiten, also habe ich die Ressourcen geladen und machte eine js-Geige von dem, was ich habe versucht:

example-fiddle

oder wenn Sie es vorziehen, nur aussehen auf dem Code:

<script>angular.module('myApp', ['ui.toggle']);</script> 

<div ng-app="myApp"> 
    <toggle ng-model="toggleValue" ng-change="changed()"></toggle> 
</div>

Jeder vertraut Angular kann dies wahrscheinlich arbeitet in 10 Sekunden aus, aber ich habe gerade erst begonnen und kann nicht scheinen, gute Beispiele zu finden, um daraus zu lernen.
Wo liege ich falsch, html Aufruf oder Abhängigkeitsdeklaration (oder beides)?

Quelle

2017-06-21 Dilfa

die Geige aktualisierte jetzt arbeiten, wenn jemand ein einfaches Beispiel braucht – Dilfa

Ich sehe, dass die cdn Adressen für Bootstrap Toggle in Ihrer Geige falsch referenziert sind.

Ich griff die richtigen Adressen, um die js und CSS-Datei von Chrome-Dev-Tools verweisen, wenn auf der Bootstrap-Toggle-Website.

Ich denke, es ist sicherer, die Bootstrap-Toggle-Dateien herunterzuladen und sie lokal von Ihrer App aus zu referenzieren.

Fügen Sie das Folgende in Ihre Geige und es wird funktionieren.


 

 
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script> 
 
    <html> 
 
    <link href="https://ziscloud.github.io/angular-bootstrap-toggle/css/angular-bootstrap-toggle.min.css" 
 
        rel="stylesheet">    
 
    <script src="https://ziscloud.github.io/angular-bootstrap-toggle/js/angular-bootstrap-toggle.min.js"></script> 
 

 
    <script>angular.module('myApp', ['ui.toggle'])</script> 
 
    <body ng-app="myApp"> 
 
     <div> 
 
     <toggle ng-model="toggleValue" ng-change="changed()"></toggle> 
 
     It's not working! What should I do? 
 
     </div> 
 
    </body> 
 

 
    </html>

Quelle

2017-06-21 19:45:49

ich sehe, habe ich vergessen „{version}“ tauschen in der Verbindung mit der Winkel Version, die ich verwende (in diesem Fall 1.6.4). Vielen Dank für Ihre Zeit, ich weiß es zu schätzen. – Dilfa

tatsächlich, das Swapping funktioniert möglicherweise nicht, aber ich habe den Punkt, verwenden Sie die entsprechenden Ressourcen – Dilfa

Hinzufügen von oben genannten Skript und Stylesheet-Dateien (github Einsen) zu meinem eckigen Projekt V1.5.8 gearbeitet. – Ahsan

Implementierung Bootstrap Angular toggle

Antwort

Verwandte Themen