如何用$watch用angularjs bootstrap进行上周查询

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.7.9/angular.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">

<div ng-app="myApp" ng-controller="myCtrl">
  <input type="text" ng-model="searchText" placeholder="输入查询条件">
  <button class="btn btn-primary" ng-click="search()">查询</button>
  <table class="table">
    <thead>
      <tr>
        <th>日期</th>
        <th>数据</th>
      </tr>
    </thead>
    <tbody>
      <tr ng-repeat="data in searchData">
        <td>{{ data.date }}</td>
        <td>{{ data.value }}</td>
      </tr>
    </tbody>
  </table>
</div>

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

app.controller('myCtrl', function($scope) {
  $scope.searchText = ''; // 初始化查询条件
  $scope.searchData = []; // 初始化查询结果

  $scope.search = function() {
    // 根据查询条件进行查询操作，获取查询结果
    // 这里可以调用后端接口或者进行本地数据处理

    // 假设查询结果为一个数组，每个元素包含日期和数据
    $scope.searchData = [
      { date: '2022-01-01', value: 100 },
      { date: '2022-01-02', value: 200 },
      { date: '2022-01-03', value: 150 },
      // 其他查询结果...
    ];
  };

  // 监听查询条件的变化
  $scope.$watch('searchText', function(newValue, oldValue) {
    // 当查询条件发生变化时，执行相应的操作
    // 这里可以进行实时查询或者其他操作
    console.log('查询条件变化：', newValue);
  });
});