Блог

Я пытаюсь реализовать компонент piral angular с помощью templateUrl.

Я могу заставить его работать с «template», но когда я меняю его на templateUrl, он не работает.

Вся документация и примеры, предоставленные piral, используют шаблон.

Это мой компонент с шаблоном:

     import { Component, Inject } from '@angular/core';
    
    @Component({
      template: `
        <div class="tile">
          <h3>Angular: {{ counter }}</h3>
          <p>
            {{ props.rows }} rows and {{ props.columns }} columns
            <extension-component name="smiley"></extension-component>
          </p>
          <button (click)="increment()">Increment</button>
          <button (click)="decrement()">Decrement</button>
        </div>
      `,
    })
    export class TileComponent {
      public counter = 0;
    
      constructor(@Inject('Props') public props: any) {}
    
      increment() {
        this.counter  = 1;
      }
    
      decrement() {
        this.counter -= 1;
      }
    }
 

Это мой компонент с templateUrl:

     import { Component, OnInit } from '@angular/core';
    
    @Component({
        templateUrl: './app.component.html',
        styleUrls: ['./app.component.css']
    })
    export class HelloWorldComponent implements OnInit {
      constructor() { }
      ngOnInit(): void {
      }
    }
 

Я попытался добавить селектор в ‘extension-component’, но он не работает, я получаю сообщение «Ошибка: селектор «extension-component» не соответствует ни одному элементу»

Вы знаете, поддерживается ли это на Piral? Кто-нибудь может указать мне на рабочий пример?