Skip to content
This repository was archived by the owner on Apr 12, 2024. It is now read-only.
This repository was archived by the owner on Apr 12, 2024. It is now read-only.

ng-include with ng-transclude - should be in core #6580

Open
@parliament718

Description

@parliament718

I really think ng-transclude should work out of the box with ng-include. The wrapper markup generated by ng-include often breaks many css selectors such as "parent > directChild" and "element + directSibling". For example, a simple bootstrap dropdown:

     <div class="dropdown">
                <button type="button" class="btn btn-primary dropdown-toggle">
                    Dropme <i class="fa fa-chevron-down"></i>
                </button>
                <div ng-include="'template.html'"></div>
            </div>

If template.html contains the <ul class="dropdown-menu">, it will be wrapped in <div class="ng-scope"> and will no longer work. Ng-include should really account for this type of situation either with a replace option or transclude support:

Replace option would put the extra attributes like class="ng-scope" directly on the element instead of using a wrapper:

     <div class="dropdown">
                <button type="button" class="btn btn-primary dropdown-toggle">
                    Dropme <i class="fa fa-chevron-down"></i>
                </button>
                <div ng-include="'template.html'" replace></div>
            </div>

Transclusion option :

 <div class="dropdown" ng-include="'template.html'">
                <button type="button" class="btn btn-primary dropdown-toggle">
                    Dropme <i class="fa fa-chevron-down"></i>
                </button>
                <div ng-transclude-include></div>
            </div>

Any reasons against this?

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions