AngularJS custom directives

Question

I'm creating template for text inputing using angular directives. Directive will receive 3 attributes: title, placeholder and model. I need attribte model to be implemented into atribute ng-model in directive template.

For example: if i create element with next attributes

<ng-text-input model="test" title="First name" placeholder="First name"></ng-text-input>

result will be next:

<div class="form-group">
    <label class="col-sm-2 control-label">First name</label>
    <div class="col-sm-9">
        <input ng-model="test" type="text" class="form-control" placeholder="First name">
    </div>
</div>

And how can i use model "test" in parent scope?

Thanks

upadete after @Maxdow comment:

directive declaration:

app.directive('ngTextInput', function(){
    return {
        restrict : 'AE',
        scope: {
            title: '@',
            placeholder : '@',
            myModel: '=ngModel'
        },
        templateUrl : 'ng-textInput.html'
    }
});

template:

<script type="text/ng-template" id="ng-textInput.html">
    <div class="form-group">
        <label class="col-sm-2 control-label">{{title}}</label>
        <div class="col-sm-9">
            <input ng-model="myModel" type="text" class="form-control" placeholder={{placeholder}}>
        </div>
    </div>
</script>

using:

<ng-text-input ng-model="test" title="First name" placeholder="First name"></ng-text-input>

but result is still:

<div class="form-group">
        <label class="col-sm-2 control-label ng-binding">First name</label>
        <div class="col-sm-9">
            <input ng-model="myModel" type="text" class="form-control ng-pristine ng-valid" placeholder="First name">
        </div>
    </div>

What am i doing wrong?

Answer 1

In your directive bind your attribute with ngModel :

app.directive('myDirective', function() {
  return {
  restrict: 'AE', 
  scope: {
    myModel: '=ngModel'
  },
  template:'<input ng-model="myModel"/>'
}});

You should be able to use is from your HTML like this :

<my-directive ng-model="whatyouwant"></my-directive>

An example : http://jsfiddle.net/maxdow/6GU6x/