goughjo02

// app-parent.ts
@Component({
  selector: 'example-parent',
  template: `./example-parent.html`,
  styleUrls: ['./parent.component.css']
})
export class ParentComponent implements OnInit {

  formBroadcast: Subject<FormGroup> = new BehaviorSubject(null);

goughjo02

<!-- app-parent.html -->
<div>
  <app-form-component [(form)]="form" />
</div>

goughjo02

<!-- child-form-component.html -->
<form [formGroup]="form">
  <label>
    First Name:
    <input type="text" formControlName="name" />
  </label>

  <label>
    Last Name:
    <input type="number" formControlName="age" />

goughjo02

// child-form-component.ts
@Component({
  selector: "child-form-component",
  templateUrl: "./child-form.component.html"
})
export class ChildFormComponent implements OnInit {
  _formValue: FormGroup;
  @Input()
  get form() {
    return this._formValue;

goughjo02

@Component({
  selector: "example-component",
  templateUrl: "./example.html"
})
export class ExampleComponent implements OnInit {
  _objectValue: any;
  @Input()
  get object() {
    return this._objectValue;
  }

goughjo02

import CustomFeature from “path-to-file”;

goughjo02

import React from "react";

export default class LazilyLoadedCustomFeature extends Component {
  state = {
    content: null
  };
  componentDidMount() {
    import(pathtofile).then(e => {
      this.setState({ content: e });
    });

goughjo02

import(pathtofile).then(e => {
  console.log("module loaded!");
});

goughjo02

import { SelectionModel } from "@angular/cdk/collections";

@Component(...metaData)
export class AppComponent implements OnInit {
  constructor(peopleSelection: PeopleSelectionService) {}
  ngOnInit(): void {
    this.peopleSelection.selection.changed.subscribe(e => {
      console.log(`I have received a value ${e}`);
    });
  }

goughjo02

@Injectable({
  providedIn: "root"
})
export class SingletonRootService {}