Как я могу использовать тот же код в шаблоне без дубликата - PullRequest
0 голосов
/ 13 декабря 2018

Angular2 компонент.Я хочу показать тот же код в модальном после нажатия на кнопку.Как использовать тот же HTML-код в модале после нажатия на кнопку.Без дублирования.

html code.
...
...
...
    <div class="modal fade" id="a" tabindex="-1" role="modal" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-lg" role="">
    <div class="modal-content">
      <div class="modal-header">
      </div>
      <div class="modal-body">
same code here from above
...
...
...

Ответы [ 2 ]

0 голосов
/ 14 декабря 2018

обновить до угла 5 и использовать ngTemplateOutletContext

    <template [ngTemplateOutlet]="templateRef">
    <div class="modal fade" id="a" tabindex="-1" role="modal" 
   aria-labelledby="exampleModalLabel" aria-hidden="true">
     <div class="modal-dialog modal-lg" role="">
         <div class="modal-content">
   <div class="modal-header">
   </div>
   <div class="modal-body">
   </template>

вы можете повторить приведенный выше код, как показано ниже

      <template  #templateRef></template>

см. Ссылку Как повторить фрагмент HTML несколько раз без ngFor и без другого @ Component

0 голосов
/ 13 декабря 2018

говорят, что у вас есть два компонента: - ChildComponent - ParentComponent

@Component({
  selector: 'child-selector',
  template: `...`,
})
export class ChildComponent {

}

затем родительский

@Component({
  selector: 'parent-selector',
  template: `
    <child-selector>
    </child-selector>
  `,
})
export class ParentComponent {
  public images: Images[] = [ ... ];

  }
}

. Вы можете проверить эту ссылку для подробного объяснения: https://itnext.io/angular-patterns-2-how-to-write-seriously-reusable-components-96be16568abc

...