Estou tentando aplicar um filtro em uma tabela de dados da entrada recebida de uma barra de pesquisa. Eu tenho um campo de entrada no cabeçalho do meu aplicativo. Ao inserir um valor nessa barra de pesquisa, preciso que a página seja redirecionada para 'http: // localhost: 1001 / # / funcionários'página e a filtragem deve ser aplicada.

Cabeçalho html:

<div class="navbar navbar-fixed-top">
    <div class="navbar-inner" ng-controller="getUserHeader">
        <div class="container">
     <form class="navbar-search pull-right" ng-submit="applySearch()">

                    <input id="input-search" class="search-query" name="mysearch" ng-model="mysearch" placeholder="Search">


                </form>
            </div>

        </div>
    </div>
    </div>

Controlador de cabeçalho:

myApp.controller('getUserHeader', ['$scope', 'commonServices', 'dataTable', '$rootScope', '$location', '$filter', function ($scope, commonServices, dataTable, $rootScope, $location, $filter) {
    commonServices.getReservations().then(function (result) {
        $scope.data = result.data;
 $scope.applySearch = function () {
            alert($scope.mysearch);


        }

    });

}]);

Quero passar o valor mysearch para o filtro na tabela de dados contida na exibição parcial 'http: // localhost: 1001 / # / funcionários' O código HTML e o código do controlador dessa página são,

HTML:

<div class="row">
<div class="span12">

    <div class="widget widget-table action-table">
    <div class="widget-header"> <i class="icon-th-list"></i>
      <h3>Employee</h3>
</div>
    <div class="widget-content  table-container" ng-controller="getEmployeesController" >

                <table ng-table="employeesList" show-filter="true" class="table table-striped table-bordered">
                    <tr ng-repeat="employee in $data">
                        <td data-title="'#'">
                           {{ (itemsPerPage * (pageNumber-1)) + $index+1 }}
                        </td>
                        <td data-title="'First Name'" sortable="'firstName'" filter="{ 'firstName': 'text' }">
                            {{employee.firstName}}
                        </td>
                    </tr>
                </table> 
    </div>
  </div>
</div>
</div>

A filtragem funciona bem dentro desta página.

Controlador:

myApp.controller('getEmployeesController', ['$scope', 'employeeServices', 'dataTable', '$window', '$timeout', '$filter', function ($scope, employeeServices, dataTable, $window, $timeout, $filter) {
    employeeServices.getEmployees().then(function (result) {
        $scope.data = result.data;
  });

Tabela de dados está configurada no arquivo App.js:

myApp.factory('dataTable', ['$filter', 'ngTableParams', function($filter, ngTableParams) {

    var factoryDefinition = {
      render: function($scope, config, componentId, data) {

        if(!config) config ={};
        var config = angular.extend({}, {page:1, count:10}, config)

        $scope[componentId] = new ngTableParams(config, {
            total: data.length, // length of data
            getData: function ($defer, params) {
                // organize filter as $filter understand it (graph object)
                var filters = {};
                angular.forEach(params.filter(), function (val, key) {
                    var filter = filters;
                    var parts = key.split('.');
                    for (var i = 0; i < parts.length; i++) {
                        if (i != parts.length - 1) {
                            filter[parts[i]] = {};
                            filter = filter[parts[i]];
                        }
                        else {
                            filter[parts[i]] = val;
                        }
                    }
                });
                // use build-in angular filter
                var filteredData = params.filter() ?
                        $filter('filter')(data, filters) :
                        data;
                var orderedData = params.sorting() ?
                        $filter('orderBy')(filteredData, params.orderBy()) :
                        data;
                params.total(orderedData.length); // set total for recalc pagination
                $defer.resolve(orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count()));
                $scope.pageNumber = params.page();
                $scope.itemsPerPage = params.count();
            }
        }); 


      }
    }

    return factoryDefinition;
  }
]);

Então, basicamente, tenho controladores diferentes no cabeçalho e na vista parcial. Eu quero inserir uma string na barra de pesquisa no cabeçalho e, ao clicar em Enter, ele deve redirecionar para a exibição parcial e aplicar o filtro na tabela de dados contida.

Como devo conseguir isso? Infelizmente, não fui capaz de criar um afundador para isso.

É assim que os valores são transmitidos para o arquivo App.js. enquanto um filtro é aplicado na exibição parcial (https://i.imgsafe.org/595e6265b7.jpg) Eu adicionei isso para que você possa ver como a tabela de dados personalizada funciona.

Desde já, obrigado.