2015-12-15 5 views
0

Я использую плагин jquery-ui tabs.Загрузка вкладки Jquery UI динамически в угловом

Проблемы я имею загружаем язычки на строки клика (таблицу в HTML) и, следовательно, длину лапки может быть динамическими на каждый пользователь щелкает строку, а также я построил вкладки в HTML, используя угловые директивы

Это, как я создавать вкладки в угловом

    <div class="modal-body"> 
        <div id='tabs'> 
         <ul > 
          <li ng-repeat="row in tabs.row"> 
           <a href="#tabs-{{$index +2}}">{{row.Tab}}</a> 
          </li> 
         </ul> 
         <div ng-repeat="row in tabs.row" id="tabs-{{$index + 2}}"> 
          {{row.Tab}} 
         </div> 
        </div> 
       </div> 

Также я модальное окно, неисправность является $ («#tabs») .tabs(); Функция не синхронизируется с нг-повторе я жду, что какое-то время, когда моя модель загружается, а затем вызвать его, как так

jsonData (в виде XML для простоты):

<data> 
     <row> 
      <Tab>General</Tab> 
     </row> 
     <row> 
      <Tab>Locations</Tab> 
     </row> 
     <row> 
      <Tab>Treatment</Tab> 
     </row> 
     <row> 
      <Tab>Training</Tab> 
     </row> 
     <row> 
      <Tab>Facilities</Tab> 
     </row> 
     <row> 
      <Tab>Equipment</Tab> 
     </row> 
     <row> 
      <Tab>Physicians</Tab> 
     </row> 
     <row> 
      <Tab>People</Tab> 
     </row> 
    </data> 

Сохранение данных:

$scope.tabs=jsonData;//save to model 


    r =setTimeout(initTabs,500); //give some time to modal to save data 

     function initTabs(){ 
      $("#tabs").tabs(); 
      console.log('timerCalled'); 
      r=clearTimeout(); 
      } 

Теперь это работает впервые, но любые последующие щелчки, чтобы сбросить вкладку, показывают, что вкладки имеют только одну вкладку и неясны.

Есть ли способ, которым я могу это сделать, я думаю о том, что кто-то перезагружает классы, добавленные функцией # id.tabs(), но ищет более простой способ.

+0

Изменит вопрос о включении кода вызывается $ («# tabs2») вкладки(); В настоящее время я не вижу никакого кода, который либо инициализирует, либо изменяет коллекцию tabs.row. –

+0

код, называемый $ (# tab) .tabs, находится в плагине jquery-ui для вкладок, в основном он принимает HTML-код и добавляет к нему кучу классов css. Я добавил, как jsonData является – Snedden27

ответ

0

Я понял, что я могу вернуться изменения, сделанные с помощью #selector.tabs() с помощью #selector.destroy()

Только улов у меня есть найти способ, если я использовал # selector.tabs или нет, один способ:

if(selector.data("ui-tabs")) 

Вот мой код инициализации повторно снова:.

    function initTabs(){ 
         if ($("#tabs2").data("ui-tabs")) { 
          $("#tabs2").tabs("destroy"); 
         } 
         $("#tabs2").tabs(); 
         console.log('timer'); 
         r=clearTimeout(); 
        } 
Смежные вопросы