I'm not getting how to over come the following situation, I have a directive with two scope passed from parent as "=" denoting the model binding say attr1
and attr2
are those values.
Inside directive I have used both in the interpolation {{attr1}}
and {{attr2}}
, Also I have used it inside input type text and email as models.
When I change the value of attr1 from textbox the value gets reflected in the interpolation {{attr1}}
, but the change in attr2
textbox is not reflected in the interpolation {{attr2}}
, although it gets binded when an valid email id is entered, but i need to show the email when its being typed.
Is there any work around for this ?
How can I do it ?
The fiddle is here.
app.directive("myDirective", function(){
return {
restrict: "EA",
//replace:true,
//transclude:true,
scope: {
attr1: "=",
attr2: "="
},
template: [
"<div>attr1 : {{attr1}}</div>",
"<div>attr2 : {{attr2}}</div>",
"attr1 : <input type='text' ng-model='attr1' /><br/>",
"attr2 : <input type='email' ng-model='attr2' /><br/>",
].join(""),
};
Thanks,
Vinod Louis