Javascript angularjs引导ng重复在选项卡内不工作

我正在尝试使用angularjs ui-bootstrap构建一个选项卡。让选项卡正常工作

在选项卡下方，使用ng repeat显示内容。 在其中一个选项卡中，希望对ng repeat中列出的内容进行搜索。 但是搜索没有起作用

如果我将搜索框移出选项卡，它将工作

HTML代码：

<tabset>
    <tab heading="Static title">Static content
      Enter text to search
    <input id="search" type="text" class="form-control" ng-model="search.title" placeholder="this is not working">  
    </tab>

    <tab select="alertMe()">
      <tab-heading>
        <i class="glyphicon glyphicon-bell"></i> Alert!
      </tab-heading>
      I've got an HTML heading, and a select callback. Pretty cool!
    </tab>
  </tabset>
  <input id="search" type="text" class="form-control" ng-model="search.title" placeholder="this is working">
  <hr />

  <div ng-repeat="tab in tabs | filter:search">
      {{tab.content}}
  </div>

---

在plunker中完成代码：

如果只添加$scope.searchnotworking=[]到它将初始化的js。我不完全确定为什么它不会，我想是$scope。

这就是为什么我喜欢初始化我计划使用/需要的控制器中的所有内容。选项卡集创建控制器无权访问的自己的作用域。如果您将

$scope.searchnotworking={}$scope.searchworking={}在控制器中，它可以工作。这是因为输入的
ng model
将查看最近的范围（tabset），并在该范围上设置模型。而过滤器只有在使用正确的过滤对象时才真正起作用（
过滤器：searchnotworking.title
）-
var TabsDemoCtrl = function ($scope) {
  $scope.tabs = [
    { title:'one', content:'Dynamic content 1' },
    { title:'two', content:'Dynamic content 2'}
  ];

};