javascriptangularangular-directiveangular-servicescustom-directive

#Angular2 How i can count numbers of custom attribute directive?

I made a custom attr directive and i will use it in siblings elements like:

<div>
   <div [customAttrDirective]="'value'">1</div>
   <div [customAttrDirective]="'value'">2</div>
   <div [customAttrDirective]="'value'">3</div>
   <div [customAttrDirective]="'value'">4</div>
</div>

I olso made a service that control all of my directives. Inside this it I want to know the count of my directives customAttrDirective.

PS: I can't do it by searching by class name(because i add classes inside the directive) and i can't do it by searching by attribute (directive name) because angular change.

Edit: replaced wrong sintax customAttrDirective="'value'" to [customAttrDirective]="'value'"

Many thanks.

Solution

  • Assuming your custom attribute directive's class name is CustomAttrDirective, in the component that you are using your custom directives, add this:

    @ViewChildren(CustomAttrDirective) dirs: QueryList<CustomAttrDirective>

    Then in life circle ngAfterViewInit, get the length of variable dirs.