CODEWITHSUNDEEP
angularjsangularjs-directive
Francisc
Francisc

Reputation: 80385

How can I use ngModel inside custom directive

I wrote a custom directive that also contains a text input.
I want to be able to link that text input to an ng-model - optionally.
That is to say, if the user passes in ng-model, have it propagate to the text input inside it.

Directive markup:

<div my-directive ng-model="query"/>

Template for directive something like:

<div class="...">
  <div class="...">
    <input type="text"/>
  </div>
</div>

Is that possible?

Upvotes: 0

Views: 1476

Answers (1)

Ilan Frumer
Ilan Frumer

Reputation: 32357

Use the isolated scope two-way-data-binding sign "="

Here is a plunker:

app.directive('myDirective', function(){
  return {
    scope: {
      model: "=ngModel"
    },
    templateUrl: "myDirective.html"
  }
})

This is the template:

<script type="text/ng-template" id="myDirective.html">
  <div class="...">
    <div class="...">
      <input type="text" ng-model="model"/>
    </div>
  </div>
</script>

Upvotes: 2

Related Questions