angularjs - Angular: how to get a template ng-model into a directive for filtering -

i'm trying create directive displays template below , allow easy filtering. when option on select list selected , value entered input box model change. need directive contain model , use model filtering.

this far i've got far. can give me guidance on i'm pretty sure there's redundant code in example too.

<div ng-controller="resultsctrl">     <div ng-controller="searchfilterctrl">   <dynamic-filters dynamic-filters-directive-search="getsearchfilters"></dynamic-filters> </div> <div ng-repeat="person in persons | filter: search">   {{person.name}} </div>    

template:

<select ng-model="filtertype">     <option value="age">age</option>     <option value="customerid">customerid</option>     <option value="productid">productid</option> </select> <input type="text" name="select-option-value" ng-model="search[filtertype]"> <p>you want filter field : {{filtertype}}</p> 

i think close it's simpler. try this

index html:

<div ng-controller="resultsctrl">   <dynamic-filters search="search"></dynamic-filters>   <div ng-repeat="person in persons | filter: search">     {{person.name}}   </div> </div> 

directive html:

<select ng-model="filtertype">     <option value="age">age</option>     <option value="customerid">customerid</option>     <option value="productid">productid</option>     <option value="name">name</option> </select> <input type="text" name="select-option-value" ng-model="search[filtertype]"> <p>you want filter field : {{filtertype}}</p> 

script.js js code:

    angular.module('app', ['dynamicfiltersdirective']).controller('resultsctrl', function($scope){     $scope.persons = [{       name: 'jim',         age: 18,       customerid: 1,       productid: 4   },{       name: 'frank',         age: 20,       customerid: 2,       productid: 5   },{       name: 'bob',         age: 20,       customerid: 3,       productid: 5   }]; }); 

directive js code:

angular.module('dynamicfiltersdirective', [])   .directive('dynamicfilters', function() {     return {       restrict: 'ae',       scope: {         search: '='       },       link: function(scope) {         scope.$watch('filtertype', function(v) {           if(!v) {return;}           //clear out search           scope.search = {};           scope.search[v] = '';         });       },       templateurl: 'filtertemplate.html'     }   });