2016-10-22 2 views
0

i den Rahmen um die ionischen toggleggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggwie Rahmen um Ionen Toggle zu entfernen

<ion-content ng-init="checkarrivee.getAllListeCriteres();"> 
<div class="swipe" on-swipe-left="warn('Must use scope')">Swipe div</div> 
<div class="list" style="width: 95%;margin-left: 2%"> 
    <span us-spinner="{color: 'blue', radius:30, width:8, length: 16}" spinner-key="spinner-0"></span> 

    <label class="item item-input item-stacked-label"> 
    <span class="input-label">Mission en cours :</span> 
    <input ion-autocomplete name="vehicule" type="text" readonly="readonly" class="ion-autocomplete" 


      items-clicked-method="itemsClicked(callback)" 
      items-removed-method="itemsRemoved(callback)" 
      placeholder="Séléctionner une mission" 
      items-method="getMissionEnCours(query)" 
      external-model="initialCountry" 
      item-view-value-key="codeDeFicheDeMission" 

      items-method-value-key="items" 
      max-selected-items="1" 
      autocomplete="off" 
      ng-model="checkarrivee.ficheDeMission" 
      required/> 
    </label> 
</div> 
<ion-list ng-repeat="(key,value) in checkload | groupBy:'Niveau'"> 
    <div class="item item-divider" >{{key}}</div> 
    <ion-item on-swipe-left="warn('Must use scope')" ng-repeat="var in value" > 


    <ion-toggle ng-model='checkarrivee.boo[var.id]' ng-click="checkarrivee.isMissionSelected(var.id,checkarrivee.ficheDeMission.id)" toggle-class="toggle-positive">{{var.designation}}</ion-toggle> 
    <button class="button button-clear icon ion-star button-assertive" 
      ng-click="toggleStar(var)" ng-show="var.star"> 
    </button> 
    <ion-option-button class="button-dark" > 
     <i class="icon ion-star"></i> 
    </ion-option-button> 
    </ion-item> 
</ion-list> 

Bild entfernen möchten: enter image description here

Antwort

2

Wenn Sie zeigen nicht die Grenze wollen Für den Toggle einfach hinzufügen style='border:0;' wie folgt:

<ion-toggle style="border:0;" ng-model='checkarrivee.boo[var.id]' ng-click="checkarrivee.isMissionSelected(var.id,checkarrivee.ficheDeMission.id)" toggle-class="toggle-positive">{{var.designation}}</ion-toggle> 

Aber ich würde vorschlagen, kein Inline-CSS zu verwenden und stattdessen alle Stile in Ihre css/scss-Datei einzufügen, da es viel schwerer zu warten ist, wenn das Projekt skaliert wird.

EDIT:

Für die CSS wird es so etwas wie dieses .list .item .noToggleBorder{border:0;}

sein hier ein codepen für Sie, es auszuprobieren.

Verwandte Themen