I was trying to write one custom directive and I put scope:true.As per my knowledge this should take parent scope and when we change in model it should change it's internal scope only. but in this below example I find that when ever I change the directive the parent also get changed. Can anyone please tell me that the reason behind it.
html
<div class="container" ng-app="myModule" ng-controller="mainControll"> <div>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Exercitationem harum numquam odio, tenetur earum deleniti culpa recusandae? Temporibus expedita, porro numquam at voluptas aspernatur nemo veniam nam, vel assumenda placeat!</div>{{text}}<br/> <input type="text" class="form-control" id="exampleInputEmail1" placeholder="Email" ng-model="text"> <firstdir></firstdir> </div>
javascript
var app = angular.module("myModule",[]);
app.controller("mainControll",function($scope){
$scope.text = "Content from controller";
});
app.directive("firstdir",function(){
return{
restrict:"EACM",
replace:"true",
scope:"true",
template:'<p>{{text}}<br/><input type="text" class="form-control" id="exampleInputEmail1" placeholder="Email" ng-model = "text"></p>'
}
})
the sample you can find here
Thank you in advance
In the code you have provided the scope is assigned with string "true" which should actually be a boolean true
app.directive("firstdir",function(){ return{
restrict:"EACM",
replace:"true",
scope: true,
template:'<p>{{text}}<br/><input type="text" class="form-control" id="exampleInputEmail1" placeholder="Email" ng-model = "text"></p>'}})
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.