Skip to content

Instantly share code, notes, and snippets.

View armanozak's full-sized avatar

Levent Arman Özak armanozak

391 followers · 26 following
View GitHub Profile
@armanozak
armanozak / app.module.ts
Created January 28, 2021 10:45
[How to Configure Angular Modules Loaded by the Router] Lazy-loading a module via router #blog #angular
// remove FooModule from imports
@NgModule({
imports: [
BrowserModule,
RouterModule.forRoot([
{
path: "",
loadChildren: () => import('./foo.module').then(m => m.FooModule),
}
@armanozak
armanozak / foo.module.ts
Created January 28, 2021 10:48
[How to Configure Angular Modules Loaded by the Router] Making a module configurable #blog #angular
// other imports are removed for brevity
import { ModuleWithProviders } from "@angular/core";
@NgModule({
imports: [
RouterModule.forChild([
{
path: "",
component: FooComponent
}
@armanozak
armanozak / child-module-factory.ts
Created January 28, 2021 10:53
[How to Configure Angular Modules Loaded by the Router] A custom child module factory #blog #angular
import {
Compiler,
Injector,
ModuleWithProviders,
NgModuleFactory,
NgModuleRef,
StaticProvider,
Type
} from "@angular/core";
@armanozak
armanozak / foo.module.ts
Created January 28, 2021 11:07
[How to Configure Angular Modules Loaded by the Router] Making child module configurable #blog #angular
// other imports are removed for brevity
import { NgModuleFactory } from "@angular/core";
import { ChildModuleFactory } from "./child-module-factory";
@NgModule(/* module metadata is removed for brevity */)
export class FooModule {
static withOptions(foo = "foo"): ModuleWithProviders<FooModule> {
return {
ngModule: FooModule,
providers: [
@armanozak
armanozak / app.module.ts
Created January 28, 2021 11:10
[How to Configure Angular Modules Loaded by the Router] Configuring child module in root module #blog #angular
@NgModule({
imports: [
BrowserModule,
RouterModule.forRoot([
{
path: "",
loadChildren: () =>
import("./foo.module").then(m => m.FooModule.asChild("bar"))
}
])
@armanozak
armanozak / app.module.ts
Created January 28, 2021 11:14
[How to Configure Angular Modules Loaded by the Router] Configuring eager-loaded child module in root module #blog #angular
// other imports are removed for brevity
import { FooModule } from "./foo.module";
@NgModule({
imports: [
BrowserModule,
RouterModule.forRoot([
{
path: "",
loadChildren: () => FooModule.asChild("bar"),
@armanozak
armanozak / destructuring-assignment.js
Created February 12, 2021 15:54
[Destructuring Assignment] How to Assign Destructured Properties or Elements Directly to Variables, Objects or Arrays #javascript #tip
let foo, bar, baz;
[ foo, bar, baz ] = ['foo', 'bar', 'baz'];
console.log(foo, bar, baz); // "foo", "bar", "baz"
({ foo, bar, baz } = {bar: 'foo', baz: 'bar', foo: 'baz'});
console.log(foo, bar, baz); // "baz", "foo", "bar"
@armanozak
armanozak / unicode.js
Last active March 12, 2021 08:59
[Unicode Escape Sequences & Code Point Escapes] How they can be used as identifiers in JavaScript #javascript #tip
/*
* Unicode escape sequences & code point escapes
* can be used as identifiers in JavaScript...
*/
const obj1 = { x: 'x' }
console.log( obj1.\u0078 ) // 'x'
const obj2 = { x: 'still x' }
console.log( obj2.\u{78} ) // 'still x'
@armanozak
armanozak / post-viewer.component.ts
Last active April 14, 2021 14:31
[Angular Reactivity Streamlined] Using route data and params in an Angular component #blog #angular #rxjs
import { Component } from "@angular/core";
import { ActivatedRoute } from "@angular/router";
import { Subscription } from "rxjs";
import { map, withLatestFrom } from "rxjs/operators";
@Component({
template: `
<div class="posts">
<app-nav icon="prev" [link]="prev" [disabled]="!prev"></app-nav>
@armanozak
armanozak / post-viewer.component.ts
Last active April 15, 2021 06:46
[Angular Reactivity Streamlined] Clearing RxJS subscriptions in an Angular component #blog #angular #rxjs
import { Component, OnDestroy } from "@angular/core";
import { ActivatedRoute } from "@angular/router";
import { Subscription } from "rxjs";
import { map, withLatestFrom } from "rxjs/operators";
@Component({
template: `
<div class="posts">
<app-nav icon="prev" [link]="prev" [disabled]="!prev"></app-nav>