AngularJS ng-repeat生成TABS

我有一種情況，可以創建一個動態數量的TABS（即在命令菜單中使用點擊和一個新的藥片選項卡對添加到已有的 - 注意：我使用Bootstrap作爲圖形元素）。AngularJS ng-repeat生成TABS

選項卡列表在$ rootScope數組內進行管理，每當需要打開新選項卡時，都會向數組添加條目（簡單push操作）。當然，有一個ng-repeat可以處理藥片對的實際創建。

這很好用（除了我不能將新選項卡設置爲自創建之後（即添加到列表中）發生在控制器中且元素仍未知的項目之外，添加了選項卡和藥片到DOM。

我想設定某種形式的計時器，但是這條道路是極其醜陋。

任何建議將不勝感激。

，你可以在角使用

來源

2017-04-04 FDavidov

哪裏是你的代碼？你用這個[bootstrap.ui]（https://angular-ui.github.io/bootstrap/#!#tabs）嗎？ –

我可以添加代碼，但不會添加任何見解。這是一個時間問題（即元素被渲染，只有這樣它才能被訪問來設置class ** active **，但是當元素被添加到控制器中的數組時，該元素仍然不爲DOM所知）。按照bootstrap.ui，不，我沒有使用它。 – FDavidov

我建議你看看我的鏈接，這是一個原生的angularjs bootstrap實現，它會讓你的生活更輕鬆 –

一件事是$超時服務：

https://docs.angularjs.org/api/ng/service/ $超時

例如，如果你需要做一些步驟的指令被渲染器和控制器初始化後，然後只需添加到控制器代碼的末尾：

$timeout(function(){ $scope.steps_to_do(); });

這將在組件的摘要循環完成後觸發這些步驟。

另外你在單位測試中對它有很好的控制。

所以，一個可行的方法是：

添加新的選項卡之前，創建中創建子控制器
後，一些家長範圍和服務承諾，在$添加一個承諾解決在該子控制器中的超時時間

來源

2017-04-04 08:36:00

不要使用超時或類似這樣的事情，因爲您永遠不知道需要多長時間來加載它。我的建議是使用這個指令你的NG-重複：

.directive('onFinishRender', function ($rootScope) { 
     return { 
      restrict: 'A', 
      link: function (scope, element, attr) { 
       if (scope.$last) { 
        $rootScope.$broadcast("ngRepeatFinished"); 
       } 
      } 
     }; 
    });

HTML：

<ul> 
    <li class="pages" data-ng-repeat="page in sidebarPages" on-finish-render></li> 
</ul>

這將完成被監聽最後一個項目被呈現在NG-重複，然後起火$廣播事件給控制器。你需要做的是什麼聽這樣在你的控制器事件：

$rootScope.$on('ngRepeatFinished', function(event, args) { 

    // do what you want to do 
});

您也可以嘗試$viewContentLoaded

$scope.$on('$viewContentLoaded', function(event, args) { 

    // do what you want to do 
});

來源

2017-04-04 08:43:12 TSlegaitis

不錯的做法，雖然我會使用'$ emit'而不是'$ broadcast'。會試一試，讓你知道。謝謝。 – FDavidov

這是否工作？ – TSlegaitis

還沒有嘗試過。別擔心。一旦我嘗試，我會讓你知道（如果它解決了我的問題，並投票）。 – FDavidov

AngularJS ng-repeat生成TABS

回答

相關問題