Utilisez $ionicModal pour faire apparaître le projet de fenêtre de modèle. Après avoir introduit boostrap3.3.4, la fenêtre de modèle devient une couche modale noire sans animation ni contenu. Voici le code. Vous pouvez l'essayer. n'a pas d'effets spéciaux. Cependant, cela n'a aucun effet. … index.html {code....

Vous ne pouvez introduire que les éléments nécessaires au bootstrap, tels que le système Grid, les utilitaires de base et les utilitaires réactifs Référence http://forum.ionicframework.com/t/responsive-grid-layout/707/20

angulaire.js - $ionicModal est en conflit avec boostrap

Utilisez $ionicModal pour faire apparaître la fenêtre du modèle

Après que le projet ait introduit boostrap3.3.4, la fenêtre du modèle devient une couche modale noire sans animation ni contenu

Voici le code que vous pouvez essayer. Le code est très simple et ne nécessite aucun effet spécial. Cependant, il n'a aucun effet...

index.html

<link rel="stylesheet" href="lib/bootstrap/bootstrap-3.3.4.min.css">

<body ng-app="starter">
    <ion-nav-view></ion-nav-view>
</body>

accueil.html

<ion-view>
    <button ng-click='openModal()'>modal</button>
</ion-view>

modal.html

<ion-modal-view>
    <ion-header-bar class="bar-energized">
        <h1 class="title">ion-modal-view</h1>
        <a class="button" ng-click="closeModal();">关闭</a>
    </ion-header-bar>
    <ion-content>
        Hello!
    </ion-content>
</ion-modal-view>

app.js

app.config(function($stateProvider, $urlRouterProvider) {
$stateProvider
.state('home', {
            url: "/home",
            templateUrl: "templates/home.html",
            controller: 'HomeCtrl'
        });
$urlRouterProvider.otherwise('/home');

controller.js

app.controller('HomeCtrl', function($scope, $state, $ionicModal) { 
   $ionicModal.fromTemplateUrl("templates/model.html", {
        scope: $scope,
        animation: "slide-in-up"
    }).then(function(modal) {
        $scope.modal = modal;
    });

    $scope.openModal = function() {
        $scope.modal.show();
    };

    $scope.closeModal = function() {
        $scope.modal.hide();
    };

});

黄舟2791 Il y a quelques jours657

angulaire.js - $ionicModal est en conflit avec boostrap

répondre à tous(1)je répondrai