title: How to pass value from Angular unit test into dynamic HTML tag
body: <p>I'd like to pass <code>"test"</code> value within my unit test to <code>nodeName</code> and <code>nodeDisplayName</code> in this dynamic HTML tag in order to display this checkbox.</p>
  
  <p>my unit test:</p>
  
  <pre><code>it('checkbox is appearing', () =&gt; {
          const nodes= [{
            nodeDisplayName: "test",
            nodeName: "test"
          }];
           //  pass value to HTML code
  
          const checkbox= fixture.debugElement.query((de) =&gt; {
            return de.nativeElement.id === 'test';
          });
          expect(checkbox).not.toBeNull();
  });
  </code></pre>
  
  <p>my HTML tag:</p>
  
  <pre><code>&lt;div *ngFor="let node of nodes let i = index" class="multipleNodes"&gt;
      &lt;label class="nodebtn bold" [id]=node.nodeName ngbTooltip="{{node.nodeDisplayName}}" tooltipClass="nodeTooltip"&gt;
           &lt;input type="checkbox" attr.for="{{node}}" value="{{i}}" name="{{i}}" (change)="checkboxChange($event)"&gt;
                    {{node.nodeName}}
      &lt;/label&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>expect HTML output (inspect):</p>
  
  <pre><code>&lt;div class="multipleNodes"&gt;
        &lt;label class="nodebtn bold active" tooltipClass="nodeTooltip" ng-reflect-tooltip-class="nodeTooltip" ng-reflect-ngb-tooltip="test" id="test"&gt;
              &lt;input type="checkbox" for="[object Object]" value=0 name=0 &gt;
                        " test "
        &lt;/label&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>The <code>n.name</code> and <code>n.displayName</code> are actually from the previous page by clicking the particular element then send to this page, but I want to test only <code>'test'</code> element.</p>
  
  <p>the relevant piece of code in my <code>.ts</code> file:</p>
  
  <pre><code>@Input() data;
   ngOnInit() {
  if (this.data.process === 'click') {
          this.setLinear = true;
          this.nodes = this.data.nodes.map((n) =&gt; {
            return {
              nodeName: n.name,
              nodeDisplayName: n.displayName,
            };
          });
  }
  </code></pre>