Ngăn chặn `ng-include` khỏi việc tạo ra phạm vi bị cô lập. AngularJS

Question

Tôi đang sử dụng chỉ thị ng-include src tại nhiều vị trí trong HTML của mình. Mỗi ng-include là tạo ra một phạm vi riêng biệt cho chính nó mà dường như đang gây ra rất nhiều rắc rối cho tôi.

Ví dụ:

<div ng-controller="parent"> 
    <div ng-include src="'id1'"> 
    </div> 
    <div ng-include src="'id2'"> 
    </div> 
    <div ng-include src="'id2'"> 
    </div> 
</div> 

Trong html được đề cập ở trên, 4 phạm vi đang được tạo. 1 ở cấp độ gốc, trong đó controller được xác định và 3 được tạo theo mặc định tại mỗi ng-include src.

Có thể ngăn chặn ng-include tạo một phạm vi riêng cho chính nó không? Nếu không thể thì có cách giải quyết cho nó không?

Answer 1

Bạn cần tạo chỉ thị của riêng mình có thể tải mẫu được chỉ định với phạm vi được cô lập riêng biệt.

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> 

Chỉ

.directive('myDirective', function() { 
    return { 
     restrict: 'AE', 
     templateUrl: function(ele, attrs) { 
      return attrs.templatePath; 
     } 
    }; 
}); 

Working Plunkr