Angularjs自定义指令范围:true更改它的父范围

时间:2016-03-07 05:44:48

标签: javascript angularjs angularjs-directive

我正在尝试编写一个自定义指令,并且我将范围设置为:true。据我所知,这应该采用父范围,当我们更改模型时,它应该只更改它的内部范围。但是在下面这个例子中,我发现当我更改指令时,父级也会被更改。任何人都可以告诉我背后的原因。

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>'
  }
})

您可以找到的样本here

提前谢谢

1 个答案:

答案 0 :(得分:3)

在您提供的代码中,作用域被赋予字符串“true”,该字符串实际上应该是布尔值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>'}})