angular - i can access to element of my component (test) -
i test component , want content of heading heading array
headings1: [{key: 'title', value: 'hello world'}]
my component use 2 other component in template
i want content first of want display component
@component({ template: ` <mae-box-label-multi-heading [label]="label" [icon]="icon" (click)="onclick()" ></mae-box-label-multi-heading> ` class testboxlabelmultiheadingcomponent { label: string headings1: [{key: 'title', value: 'hello world'}] } it('should information of heading 1', () => { hostcomp.headings1 fixture.detectchanges() const testheading = hostcompfixture.debugelement.query(by.css('mae-box-label-multi-heading')).nativeelement console.log(testheading) }) }
and log return :
<mae-box-label-multi-heading class="box-element box-label"><!----> <a class="box-label__title-label-wrapper box-label__title-label-wrapper--margin-top"> <!----> <span maeoverflow=""></span> </a> </mae-box-label-multi-heading>
while if inspect element component careful long ;) :
<mae-box-label-multi-heading class="box-element box-label" ng-reflect-headings="[object object],[object object" ng-reflect-label=""><!--bindings={}--> <a class="box-label__title-label-wrapper box-label__title-label-wrapper--margin-top" ng-reflect-klass="box-label__title-label-wrapper" ng-reflect-ng-class="[object object]" ng-reflect-external-link="false"> <!--bindings={ "ng-reflect-ng-if": "[object object],[object object" }--> <div maeoverflow="" class="box-label__title box-label__title--label-text"> <!--bindings={ "ng-reflect-ng-for-of": "[object object],[object object" }--> <span class="box-label__title-element"> <span class="box-label__title-key">title</span>: <span class="box-label__title-value">hello world</span> </span> </div><!----> <span maeoverflow="" class="box-label__label box-label__label--text"></span> </a> </mae-box-label-multi-heading>
if have idea how can access element heading 1
thanks
Comments
Post a Comment