Question

我在json文件中写了typescript的锚标记，条件在html中写了。所以我无法获得锚标记值：

<div class="panel-heading" role="tab" id="headingOne">
                <h4 class="panel-title">
                  <a ngClass="{{item.className}}" (click)="expandCollapse(i+1,item)" id="demo" role="button"
                    data-toggle="collapse" data-parent="#accordion" href="{{item.href}}" aria-expanded="true"
                    aria-controls="">
                    {{i+1}}. {{item.title}}
                  </a>
                </h4>
              </div>
              <div id="{{item.id}}" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingOne">
                <div class="panel-body" style="padding-top: 0px;font-style: italic;padding-left: 30px;">
                  {{item.description}}
                </div>
              </div>

在.ts文件中，我写了json：

    this.items = [ {
              "id":"9","href":"#9","className":"addBorder collapsed","title":"Does the discount apply to my current insurance? ","description":"No. These are offers from other participating insurers, and the discount applies only to what they would otherwise charge in premiums without your driving data."
            },
            {
              "id":"10","href":"#10","className":"addBorder collapsed","title":"Click here to view more frequently asked questions","description":"<a  href='https://crrs.secure.force.com/hondaknowledge/articles/Public_Knowledge/HondaLink-Frequently-Asked-Questions-H/?l=en_US&c=Division_Subdivision%3AHondaLink&fs=Search&pn=1'>FAQ</a>"
            },
           ]

Answer 1

items是一个数组，因此您需要在HTML中引用它时传递索引

<div id="{{item[0].id}}" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingOne">
  <div class="panel-body" style="padding-top: 0px;font-style: italic;padding-left: 30px;">
    {{item[0].description}}
  </div>
</div>

或像下面那样循环数组

<div *ngFor="let item of items">
  <div id="{{item.id}}" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingOne">
    <div class="panel-body" style="padding-top: 0px;font-style: italic;padding-left: 30px;">
      {{item.description}}
    </div>
  </div>
</div>

无法在输出中获取锚标记值

1 个答案: