防止`ng-include`创建隔离范围.AngularJS

Adi*_*she 8 javascript directive angularjs angularjs-directive angularjs-ng-include

ng-include src在HTML中的多个地方使用指令.每个ng-include都为自己创造了一个孤立的范围,这显然给我带来了很多麻烦.

例如.

<div ng-controller="parent">
    <div ng-include src="'id1'">
    </div>
    <div ng-include src="'id2'">
    </div>
    <div ng-include src="'id2'">
    </div>
</div>
Run Code Online (Sandbox Code Playgroud)

在上面提到的html中,创建了4个范围.在父级中controller定义了1,默认情况下每个都创建了3个ng-include src.

是否可以防止ng-include为自己创建一个孤立的范围?如果不可能那么有一个解决方法吗?

Pan*_*kar 17

您需要创建一个自己的指令,可以加载指定的模板withoud隔离范围.

HTML

<div ng-controller="parent">
    <div my-directive template-path="id1">
    </div>
    <div my-directive template-path="id2">
    </div>
    <div my-directive template-path="id2">
    </div>
</div>
Run Code Online (Sandbox Code Playgroud)

指示

.directive('myDirective', function() {
  return {
      restrict: 'AE',
      templateUrl: function(ele, attrs) {
          return attrs.templatePath;
      }
  };
});
Run Code Online (Sandbox Code Playgroud)

工作Plunkr