Levent Arman Özak armanozak

Development Expert @SAP, Angular GDE, founder @ng-turkey, ex-team member @abpframework, JavaScript expert, trainer, and blogger

armanozak / post-viewer.component.ts

Last active April 15, 2021 13:39

[Angular Reactivity Streamlined] Using ng-observe to observe a collection of emitted values #blog #angular #rxjs

	import { ChangeDetectionStrategy, Component, Inject } from "@angular/core";
	import { ActivatedRoute } from "@angular/router";
	import { OBSERVE, ObserveFn, OBSERVE_PROVIDER, toValue } from "ng-observe";
	import { map } from "rxjs/operators";

	@Component({
	template: `
	<div class="posts">
	<app-nav icon="prev" [link]="prev" [disabled]="!prev"></app-nav>

armanozak / post-viewer.component.ts

Created April 15, 2021 07:50

[Angular Reactivity Streamlined] Using ng-observe to observe and react to emitted values #blog #angular #rxjs

	import { ChangeDetectionStrategy, Component, Inject } from "@angular/core";
	import { ActivatedRoute } from "@angular/router";
	import { OBSERVE, Observed, ObserveFn, OBSERVE_PROVIDER } from "ng-observe";
	import { map } from "rxjs/operators";

	@Component({
	template: `
	<div class="posts">
	<app-nav icon="prev" [link]="prev" [disabled]="!prev"></app-nav>

armanozak / post-viewer.component.ts

Last active April 15, 2021 06:46

[Angular Reactivity Streamlined] Triggering change detection when an observable emits a new value in Angular #blog #angular #rxjs

	import { ChangeDetectionStrategy, ChangeDetectorRef, 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>

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>

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 / 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 / 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 / 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 / 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 / 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: [