Сращивание массива / Эффект на

0

У меня есть переменная массива в $ scope, которую я использую для создания вкладок на лицевой стороне. У меня возникла проблема с реализацией функции tab tab. Я использую AngularJS/bootstrap. Это код для удаления вкладок:

var removeTab = function (index) {
    $scope.tabs.splice(index, 1);
};

Это код, который я создаю для вкладок:

 <tabset class="tab-container">
    <tab id = "tabContent" ng-repeat="tab in tabs" active="tab.active" ng-select="select"> <!-- the tab highlight directive -->
      <tab-heading>
      <span>{{tab.title}}</span>
      <i class="glyphicon glyphicon-remove" ng-click="removeTab($index)"></i> <!-- the tab close button -->
    </tab-heading>

    <textarea ui-codemirror= "{ onLoad : codemirrorLoaded }"></textarea>

  </tab>

Когда я открываю несколько вкладок, а затем пытаюсь закрыть его, используя кнопку removeTab, которую я создал, все вкладки закрываются. Странная часть состоит в том, что консоль также очищается. Я не совсем уверен, что происходит.

Спасибо за ваше время!

  • 2
    не должен ли он сказать $scope.removeTab = function(index) ....
  • 0
    кажется твой код работает: plunkr
Теги:

1 ответ

0

Хорошо, я немного изменил ваш код, чтобы получить визуальные эффекты. Таким образом, разница была

//Your function 
var removeTab = function(index){
   $scope.tabs.splice(index,1);
}
__________
//changed it to
$scope.removeTab = function(index){
   $scope.tabs.splice(index,1);
}

var app = angular.module('tabco',[]);

app.controller('TabCtrl', ['$scope', function($scope){
  $scope.tabs = [{value:1},{value:2},{value:3},{value:4}];
  $scope.removeTab = function(index){
    $scope.tabs.splice(index,1);
  }
}]);
.tabcont{
border:1px solid #ccc;
}
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
   <div ng-app="tabco" class="tab-container"  ng-controller="TabCtrl">
    <div class="tabcont" ng-repeat="tab in tabs" > <!-- the tab highlight directive -->
      <div>
        <span>{{tab.value}}</span>
        <i class="glyphicon glyphicon-remove" ng-click="removeTab($index)">X</i> <!-- the tab close button -->
      </div>

    <textarea></textarea>

    </div>
   </div>

Ещё вопросы

Сообщество Overcoder
Наверх
Меню