Skip to content

Latest commit

 

History

History
48 lines (40 loc) · 1.01 KB

File metadata and controls

48 lines (40 loc) · 1.01 KB

Upgrading 1.0.0 to 2.0.0

Below approaches have changed

To create FaIconComponent dynamically:

@Component({
  selector: 'fa-host',
  template: `
    <button (click)="createIcon()">
      Create
    </button>
    <br>
    <ng-container #host></ng-container>
  `
})
class HostComponent {
  readonly container = viewChild('host', { read: ViewContainerRef });

  createIcon() {
    const componentRef = this.container().createComponent(FaIconComponent);
-    componentRef.instance.icon = faUser;
-    componentRef.instance.render();

+    componentRef.setInput('icon', faUser);
  }
}

To update FaIconComponent programmatically:

@Component({
  selector: 'fa-host',
  template: '<fa-icon [icon]="faUser" (click)="spinIcon()"></fa-icon>'
})
class HostComponent {
  readonly faUser = faUser;
  readonly iconComponent = viewChild(FaIconComponent);

  spinIcon() {
    const iconComponent = this.iconComponent();
-    iconComponent.animation = 'spin';
+    iconComponent.animation.set('spin');
  }
}