Угловая сетка пользовательского интерфейса - пользовательский шаблон заголовка и фильтрация

Question

Я ищу хороший пример наличия базового фильтра и пользовательского шаблона. У меня возникли проблемы с поиском хорошего примера на сайтах. См. Прикрепленную панель, где я настраиваю фильтрацию и имеет собственный шаблон заголовка. Нужно ли встраивать фильтрацию в шаблон заголовка?

http://plnkr.co/edit/VMETPu30iiFc3GYmZZRS?p=preview

var app = angular.module('app', ['ngAnimate', 'ui.grid']); 

app.controller('MainCtrl', ['$scope', '$http', function ($scope, $http) { 
    $scope.columns = [{ field: 'name', headerCellTemplate: '<div class="grand-total">Name</div>' }, { field: 'gender' }]; 
    $scope.gridOptions = { 
    enableSorting: true, 
    columnDefs: $scope.columns, 
    enableFiltering: true 
    }; 

    $scope.remove = function() { 
     $scope.columns.splice($scope.columns.length-1, 1); 
    } 

    $scope.add = function() { 
     $scope.columns.push({ field: 'company', enableSorting: false }); 
    } 

    $scope.splice = function() { 
     $scope.columns.splice(1, 0, { field: 'company', enableSorting: false }); 
    } 

    $scope.change = function() { 
    $scope.columns = [{ field: 'First', }, { field: 'Second' }, { field: 'third' }]; 
    $scope.gridOptions.columnDefs = $scope.columns; 
    } 

    $scope.unsplice = function() { 
     $scope.columns.splice(1, 1); 
    } 

    $http.get('https://rawgit.com/angular-ui/ui-grid.info/gh-pages/data/100.json') 
    .success(function(data) { 
     $scope.gridOptions.data = data; 
     console.log(data) 
    }); 
}]); 

Заранее спасибо!

Answer 1

Вы можете создать собственный шаблон и добавить его в свою сетку. Попробуйте это post, вы можете получить некоторые идеи. Я обновил некоторые коды в блоге post.you можно сделать что-то вроде этого. Надеюсь, это поможет. Code Sample.