Impostazione della scheda statica iniziale nel bootstrap angolare

Non riesco a impostare la scheda iniziale in un gruppo di avvio angolare. Imposta sempre la tabulazione più a sinistra su attiva.Impostazione della scheda statica iniziale nel bootstrap angolare

Dato il codice HTML:

<tabset> 
    <tab heading="Static 1" active="data.static1">Static content</tab> 
    <tab heading="Static 2" active="data.static2">Static content</tab> 
</tabset>

e JS:

angular.module('plunker', ['ui.bootstrap']); 
var TabsDemoCtrl = function ($scope) { 
    $scope.data = {static1: false, static2: true} 
};

vedere l'aggiornamento Plunker

6 ago 2013: Ora fissa monte vedere la github issue.

fonte

2013-07-17 Cam

Ho aggiunto una nuova risposta perché è ancora un problema nella versione 0.6.0 e questa domanda è alta in google. – Thomas

Sembra che le schede (statiche) sovrascrivano tutto ciò che viene passato a attivo quando viene eseguita la direttiva. Presumo che sia un bug. Veloce e sporco, è possibile utilizzare un timeout con ritardo di 0 secondi per impostare lo stato attivo. Almeno nel plunkr, questo non causa alcun sfarfallio. Nel vostro controller:

$scope.data = {}; 
$timeout(function() { 
    $scope.data.static2 = true; 
}, 0)

http://plnkr.co/edit/3KbdKh?p=preview

fonte

2013-07-17 09:24:33 Narretz

C'è un problema in tutte le versioni di angolare-ui/bootstrap Versione fino a 0.6.0:

http://plnkr.co/edit/73lm068buZf851h47FVQ?p=preview

funziona nel ramo bootstrap3 che devi costruire da te:

http://plnkr.co/edit/uOASvZ71DzgZqODmHQP8?p=preview

fonte

2013-11-14 16:01:21 Thomas

grazie per le informazioni. Nel caso in cui le persone siano curiose [pull # 834] (https://github.com/angular-ui/bootstrap/pull/834) risolto questo problema. La cancellazione delle righe 237-239 sono i cambiamenti chiave (ho modificato la mia versione di ui angolare con quelle modifiche - ho raggiunto la stessa conclusione in modo indipendente). – Amir

ho avuto questo problema oggi e ho trovato la strada più breve per andare in giro è stato per impostare utilizzando ng-init:

<tabset justified="true" ng-init="tabs[initialTab].isActive = true"> 
    <tab heading="Static 1" active="tabs.Inprogress.isActive"></tab> 
    ...

fonte

2014-11-27 10:54:54 XGreen

Arghhh: grazie, grazie. Potrei selezionare qualsiasi scheda diversa dalla prima a livello di codice - con ng-init, anche se quella prima ora funziona. Ho perso 2 ore cercando - così frustrante! – Leo

tuo codice funziona nelle ultime versioni di ui-bootstrap (versioni testate 0.7 .0 attraverso 0.13.0 compreso):
http://plnkr.co/edit/SzeTqXVSd8CiKL9nkjDC?p=preview

HTML:

<!DOCTYPE html> 
<html ng-app="myApp"> 

    <head> 
    <script data-require="[email protected]" data-semver="1.4.0" src="https://code.angularjs.org/1.4.0/angular.js"></script> 
    <script data-require="[email protected]" data-semver="0.13.0" src="http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.13.0.min.js"></script> 
    <link data-require="[email protected]*" data-semver="3.3.1" rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" /> 
    <script src="script.js"></script> 
    </head> 

    <body ng-controller="ExampleController as example"> 
    <tabset> 
     <tab heading="Static 1" active="data.static1">Static content1</tab> 
     <tab heading="Static 2" active="data.static2">Static content2</tab> 
    </tabset> 
    </body> 

</html>

JavaScript:

angular.module("myApp", ["ui.bootstrap"]) 
    .controller("ExampleController", function ($scope) { 
    $scope.data = { 
     static1: false, 
     static2: true 
    }; 
    });

Una Gotcha essere consapevoli è che questo non funzionerà se la direttiva ngController è posto sulla <tabset> elemento. Nel codice sopra, ho inserito la direttiva ngController sull'elemento corpo >.

fonte

2015-06-07 14:38:34

Impostazione della scheda statica iniziale nel bootstrap angolare

risposta

Problemi correlati