Implémentation de Bootstrap Angulaire à bascule

Je suis nouveau sur Angular, et j'ai essayé d'implémenter la fonctionnalité/module Bootstrap Angular toggle sur mon site web.Implémentation de Bootstrap Angulaire à bascule

Il existe de la documentation sur le site Web lié, mais vous ne trouverez nulle part d'exemples de travail complets (par exemple, de petits devinettes indépendantes). Je ne peux pas cette fonction de travail du tout, donc je l'ai chargé les ressources, et a fait un js-violon de ce que j'ai essayé:

example-fiddle

ou si vous préférez regarder juste au code:

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

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

tout le monde familier angulaire peut probablement travailler ceci en 10 secondes, mais je viens juste de commencer et ne peut pas sembler trouver de bons exemples pour apprendre.
Où est-ce que je me trompe ici, appel html ou déclaration de dépendance (ou les deux)?

Source

2017-06-21 Dilfa

mis à jour le violon au travail maintenant, si quelqu'un a besoin d'un exemple simple – Dilfa

Je vois que les adresses cdn de bootstrap toggle sont mal référencées dans votre violon.

J'ai saisi les adresses correctes pour référencer le fichier js et css à partir des outils de développement chrom lorsque sur le site Web de démarrage bootstrap.

Je pense qu'il est plus sûr de télécharger les fichiers d'amorçage bootstrap et de les référencer localement à partir de votre application.

Collez ce qui suit dans votre violon et cela fonctionnera.


 

 
    <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>

Source

2017-06-21 19:45:49

je vois, j'ai oublié de swap « {version} » dans le lien avec la version angulaire que j'utilise (dans ce cas, 1.6.4). Eh bien, merci beaucoup pour votre temps, je l'apprécie. – Dilfa

effectivement, ce swap peut ne pas fonctionner, mais j'ai eu le point, utilisez les ressources appropriées – Dilfa

ajoutant ci-dessus les fichiers script et stylesheet (github) à mon projet angulaire V1.5.8 travaillé. – Ahsan

Implémentation de Bootstrap Angulaire à bascule

Répondre

Questions connexes