fix(angular): type resolution with strict templates

[sean-perkins]

Updates the implementation pattern for event emitters in the Angular output target to solve inaccurate type detection for strict templates and Angular Language Service. This also eliminates the dependency on rxjs with the implementation pattern. Confirmed that this change does not regress the solution to prevent duplicate event emissions.

Current version output:

export declare interface IonCheckbox extends Components.IonCheckbox {}

@ProxyCmp({
  tagName: 'ion-checkbox',
  customElement: undefined,
  inputs: ['checked', 'color', 'disabled', 'indeterminate', 'mode', 'name', 'value']
})
@Component({
  selector: 'ion-checkbox',
  changeDetection: ChangeDetectionStrategy.OnPush,
  template: '<ng-content></ng-content>',
  inputs: ['checked', 'color', 'disabled', 'indeterminate', 'mode', 'name', 'value']
})
export class IonCheckbox {
  /**
   * Emitted when the checked property has changed. 
   */
  @Output() ionChange = new EventEmitter<CustomEvent<ICheckboxCheckboxChangeEventDetail>>();
  /**
   * Emitted when the checkbox has focus. 
   */
  @Output() ionFocus = new EventEmitter<CustomEvent<void>>();
  /**
   * Emitted when the checkbox loses focus. 
   */
  @Output() ionBlur = new EventEmitter<CustomEvent<void>>();


  protected el: HTMLElement;
  constructor(c: ChangeDetectorRef, r: ElementRef, protected z: NgZone) {
    c.detach();
    this.el = r.nativeElement;
  }
}

Breaking change

Before this would work:

@ViewChild(IonSlides, { static: true }) slides: IonSlides;

this.slides.ionSlideDidChange.subscribe(() => {
  console.log('slideDidChange');
});

After, implementers will need to use rxjs to convert the DOM event:

import { fromEvent } from 'rxjs';

@ViewChild(IonSlides, { static: true, read: ElementRef }) slides: IonSlides;

fromEvent(this.slides, 'ionSlideDidChange').subscribe(() => {
  console.log('slideDidChange');
});

Fixes issue in Framework repo: ionic-team/ionic-framework#24245