JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js"></script>
<link rel="stylesheet" href="https://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<script src="https://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.11.0.min.js"></script>
<body ng-app="ui.bootstrap.demo">
    <div ng-controller="TabsDemoCtrl">
      
      <tabset>
        <tab heading="Tab 1">
            
            <input ng-model="txtSearch" />
            <table class="table">
                <tr ng-repeat="item in obj.filteredCollection = (myCollection | filter: txtSearch)">
                    <td ng-bind="item"></td>
                </tr>
            </table>
            <button ng-click="addItem()">Add item</button>
            
        </tab>
        <tab heading="Tab 2">
            <p>Tab 2 content</p>
        </tab>
      </tabset>
    
    
    </div>
</body>

JavaScript

angular.module('ui.bootstrap.demo', ['ui.bootstrap']);

angular.module('ui.bootstrap.demo').controller('TabsDemoCtrl', function ($scope, $timeout) {
     $scope.myCollection = ['Tomato', 'Cheese', 'Wine', 'Cherry', 'Chocolate'];

    $scope.addItem = function() {
        $scope.myCollection.push('ExtraItem of ' + new Date());
    };
    $scope.obj = { filteredCollection : [] };
    $timeout(function() { console.log($scope.filteredCollection) }, 10000);
    $scope.$watchCollection('obj.filteredCollection', function(newVal) {
        if (typeof($scope.obj.filteredCollection) != 'undefined')
            console.log('Results changed : ' + $scope.obj.filteredCollection.length);
    });
});