Skip to content

Instantly share code, notes, and snippets.

View app-parent.js
// 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);
View app-parent.html
<!-- app-parent.html -->
<div>
<app-form-component [(form)]="form" />
</div>
View child-form.component.html
<!-- child-form-component.html -->
<form [formGroup]="form">
<label>
First Name:
<input type="text" formControlName="name" />
</label>
<label>
Last Name:
<input type="number" formControlName="age" />
View child-form.component.ts
// 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;
View two-way-data-binding-angular.ts
@Component({
selector: "example-component",
templateUrl: "./example.html"
})
export class ExampleComponent implements OnInit {
_objectValue: any;
@Input()
get object() {
return this._objectValue;
}
View dynamic-import-react-example-1.js
import React from "react";
export default class LazilyLoadedCustomFeature extends Component {
state = {
content: null
};
componentDidMount() {
import(pathtofile).then(e => {
this.setState({ content: e });
});
View dynamic-import-example-1.js
import(pathtofile).then(e => {
console.log("module loaded!");
});
View observable-subscription-example-1.ts
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}`);
});
}
View provide-in-root.ts
@Injectable({
providedIn: "root"
})
export class SingletonRootService {}