Angular – enums and switch case in templates
Although TypeScript has support for enums, Angular’s templates can access only fields …. by the related component. I will present two ways of accessing enums in templates.
Posts
Make a sidebar always visible regardless of scroll
My blog includes a sidebar that is sometimes visible (on the home page or when browsing by a tag or category). However, after scrolling far, the scrollbar scrolls too and becomes invisible. I wanted the sidebar to be visible even after scrolling, but it had to be smart.
…NeutralinoJS vs ElectronJS
I decided to create a cross-platform desktop application that will run on Windows, MacOS, and Linux. I heard about a recent project Neutralino and tried using this framework. It has been a tough road…
…Angular: extract a module with existing components and important lesson about NgModule
I often see Angular applications with bad architecture, especially no separation on modules. As a result, all components of an application are put in a single app/components folder which makes it hard to separate concerns. Which components are grouped together? Which components require a service? Which component is merely a part of another component? Are there any dumb components?
In this article, I’ll show how easy it is to refactor an Angular application and extract a new module with existing components. I’ll describe a simple case, with no global services.
…Add Angular Material to an Angular 8 application
Let’s assume you have an Angular application and you want to add the Angular Material library to it. What steps are necessary to take?
…Multiple return values from multiple promises
Let’s assume we want to retrieve some data from an API and show it together with the original data. For instance, I’ll use the DuckDuckGo API to find capital names for countries.
…Add behavior to HTML using Alpine.js – a Todo app
Sometimes I create pages with minimal interaction and amount of JavaScript – for instance, with a hamburger menu, toggle or tabs. They require simple yet repetitive JavaScript code. There are nice big components or frameworks that solve this problem (like Bootstrap, React, Vue), but the problem is their size and often a complexity to set up. Recently (in November 2019), a new library emerged – Alpine.js.
Read moreTypeScript – Ambient Namespaces in Declaration Files
I don’t want to create a guide on the declaration files but only share some tips: what is an ambient declaration, what’s specific about ambient namespaces and what is the result of using ambient namespaces.
…Waiting for two parallel callbacks
While trying to enhance a Chrome plugin that translates text on pages (GitHub), I wanted to show two translations at once – of the pointed word and of the entire sentence or paragraph. Technically it was not hard except for the part of retrieving two translation results and displaying them in one popup.
…Configure Angular CLI to use tabs instead of spaces
As a tab indentation enthusiast, I wanted to use an Angular project with tabs instead of 2 spaces. Unfortunately, there are several settings to change, and the schematics used by ng CLI command supports only spaces. Despite numerous requests (e.g. here and here), Google did not decide to introduce an option to set indentation for generated files. I went through the process of making Angular project tabbed and I’ll describe it here.