Ионный выбранный вопрос переключения

У меня проблема в моем ионном приложении.Ионный выбранный вопрос переключения

Как вы можете видеть, моя вторая кнопка переключения выглядит иначе, чем первая. Я испробовал так много разных вариантов html, чтобы исправить это. Но я не могу найти решение. И иконы не выглядят кишкой.

Вот скриншот: ionic app screenshot

HTML:

<ion-view> 
    <ion-content class="padding"> 
     <div class="list"> 
      <form ...> 
       <!-- ... --> 
       <div class="card"> 

        <div class="item item-divider"> 
         Zugangsdaten 
        </div> 

        <div class="item item-text-wrap"> 
         <label class="item item-input"> 
          <i class="icon ion-ios-people"></i> 
          <span class="input-label">Klasse</span> 
          <input required type="text" ng-model="username" 
            placeholder="Beispiel: R1a"> 
         </label> 
        </div> 

        <div class="item item-text-wrap"> 
         <label class="item item-input"> 
          <i class="icon ion-key"></i> 
          <span class="input-label">Passwort</span> 
          <input required type="password" ng-model="password" 
            placeholder="Frage deine/n Lehrer/in nach dem Passwort."> 
         </label> 
        </div> 
       </div> 

       <div class="card"> 

        <div class="item item-divider"> 
         Benachrichtigungen 
        </div> 

        <div class="item"> 
         <ion-toggle ng-model="pushNotification" toggle-class="calm"><i 
           class="icon ion-android-notifications"></i> 
          Push-Benachrichtung 
         </ion-toggle> 
        </div> 

        <div class="item"> 
         <ion-toggle ng-model="emailNotification" toggle-class="calm"><i class="icon ion-email"></i> 
          E-Mail-Benachrichtung 
         </ion-toggle> 
        </div> 
       </div> 

       <!-- buttons --> 

      </form> 
     </div> 
    </ion-content> 
</ion-view>

Ионные версия: 1.7.15

Спасибо!

источник

2016-05-27 Jo Jay

проверить, если $ scope.emailNotification имеет какое-то значение .. в этом .. в контроллере! –

Я сделал фрагмент и все, что ожидалось. Должно быть что-то еще. Ваш опубликованный код работает.

var app = angular.module("myApp",['ionic']); 
 
app.controller("myCtrl", function($scope){ 
 
    $scope.pushNotification = true; 
 
    $scope.emailNotification = false; 
 
    });

<head> 
 
     <link rel="stylesheet" type="text/css" href="http://code.ionicframework.com/1.3.1/css/ionic.css"> 
 
     <script src="http://code.ionicframework.com/1.3.1/js/ionic.bundle.js"></script> 
 
    </head> 
 
    <body ng-app="myApp" ng-controller="myCtrl"> 
 
    <ion-view> 
 
     <ion-content class="padding"> 
 
      <div class="list"> 
 
       <form ...> 
 
        <!-- ... --> 
 
        <div class="card"> 
 

 
         <div class="item item-divider"> 
 
          Zugangsdaten 
 
         </div> 
 

 
         <div class="item item-text-wrap"> 
 
          <label class="item item-input"> 
 
           <i class="icon ion-ios-people"></i> 
 
           <span class="input-label">Klasse</span> 
 
           <input required type="text" ng-model="username" 
 
             placeholder="Beispiel: R1a"> 
 
          </label> 
 
         </div> 
 

 
         <div class="item item-text-wrap"> 
 
          <label class="item item-input"> 
 
           <i class="icon ion-key"></i> 
 
           <span class="input-label">Passwort</span> 
 
           <input required type="password" ng-model="password" 
 
             placeholder="Frage deine/n Lehrer/in nach dem Passwort."> 
 
          </label> 
 
         </div> 
 
        </div> 
 

 
        <div class="card"> 
 

 
         <div class="item item-divider"> 
 
          Benachrichtigungen 
 
         </div> 
 

 
         <div class="item"> 
 
          <ion-toggle ng-model="pushNotification" toggle-class="calm"><i 
 
            class="icon ion-android-notifications"></i> 
 
           Push-Benachrichtung 
 
          </ion-toggle> 
 
         </div> 
 

 
         <div class="item"> 
 
          <ion-toggle ng-model="emailNotification" toggle-class="calm"><i class="icon ion-email"></i> 
 
           E-Mail-Benachrichtung 
 
          </ion-toggle> 
 
         </div> 
 
        </div> 
 

 
        <!-- buttons --> 
 

 
       </form> 
 
      </div> 
 
     </ion-content> 
 
    </ion-view> 
 
    </body>

источник

2016-05-28 06:06:33

Спасибо за вас ответы. Удаление из переключателей решило мою проблему. Теперь вторая кнопка переключения выглядит нормально.

источник

2016-05-30 20:43:55

Ионный выбранный вопрос переключения

ответ

Смежные вопросы