Angularjs search filter

Question

how to access the search model inside your header directive using angularJS

     <div header showprofile="false" >
        <div class="searchView col-xs-12">

                <input type="text" placeholder="Search" ng-model="search" />         
        </div>
    </div>
    <div class="divtop">
        <!-- <input type="text" placeholder="Search" ng-model="search" /> -->
        <div class="it-content col-xs-12 col-sm-12 col-md-12">
            <div ng-repeat="it in itBatch.its | filter: search" class="visit-card">

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

I think what you're asking is how to access the search model inside your header directive, is that right? — Diego Vieira
– Diego Vieira, Commented Apr 6, 2016 at 11:08

atefth · Accepted Answer · 2016-04-06 12:16:22Z

1

You can pass the model to the directive like this -

<div header showprofile="false" search="search">
    <div class="searchView col-xs-12">
        <input type="text" placeholder="Search" ng-model="search" />         
    </div>
</div>

Update your directive to accept it

.directive('header', function() {
  function link(scope, element, attrs) {
    scope.$watch(attrs.search, function(value) {
      console.log(value);
    });
  }
  return {
    restrict: 'EA',
    scope: {
      showprofile: '=',
      search: '=',
    },
    link: link
  };
});

UPDATE Here is a fiddle.

Hope that helps.

edited Apr 6, 2016 at 12:16

answered Apr 6, 2016 at 11:48

atefth

1,62313 silver badges27 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

atefth Over a year ago

can you please post your directive code and explain what you're trying to do?

user5320627 Over a year ago

Am trying to give search filter for my page in the header

atefth Over a year ago

Please check my updated answer, it's working fine for me.. jsfiddle.net/yd7gddbu/1

atefth Over a year ago

@MadhumithaReddy what?

Collectives™ on Stack Overflow

Angularjs search filter

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related