Как вставить гиперссылки внутри гармошки? - PullRequest
Новая
       19

Как вставить гиперссылки внутри гармошки?

0 голосов
/ 26 января 2019

Мне нужно вставить кучу синих гиперссылок в гармошку. Поэтому, когда мы щелкаем по заголовку, появившаяся область расширения будет содержать пару строк, вызывающих некоторую функцию.

Я попытался следовать примеру на веб-сайте Angular Material: https://stackblitz.com/angular/ybovddobxlj?file=app%2Fexpansion-overview-example.html

Я изменил расширение-Overview-example.html следующим образом: 

<mat-accordion>
  <mat-expansion-panel>
    <mat-expansion-panel-header>
        <mat-panel-title>
            ALL FILES
        </mat-panel-title>
    </mat-expansion-panel-header>

    <div> <!-- To put them on separate lines -->
        <mat-form-field>
            <label title="File 1" onclick="openFile1()"></label> <!-- THIS LINE BREAKS THE PAGE. HELP? -->
        </mat-form-field>
    </div>

    <div> <!-- To put them on separate lines -->
      <mat-form-field>
            <label title="File 2" onclick="openFile2()"></label> <!-- THIS LINE BREAKS THE PAGE. HELP? -->
      </mat-form-field>
    </div>

  </mat-expansion-panel>
</mat-accordion>

1 Ответ

0 голосов
/ 26 января 2019

Прежде всего, удалите mat-form-field, это не требуется, если вы просто хотите простую ссылку в аккордеоне (это фактически то, что нарушает ваш код).

Просто добавьте простой тег p с обработчиком событий (click) (это не onclick в Angular). Это должно сделать трюк: 

<div>
  <p (click)="openFile1()">File 1</p>
</div>

Если вы хотите использовать label вместо этого, используйте его так: 

<div>
  <label (click)="openFile2()">File 2</label> 
</div>

У него должно быть значение, иначе оно не отображается, и вы не можете щелкнуть по нему.

Здесь это стек стека с вашим отредактированным примером кода, чтобы он работал.

...