arconsis Blog

Kategorie : angular

Create external webcomponents with Angular Elements

With Angular Elements you are able to create components, bundle them into one file and use them in other projects. The normal procedure to create a component is to use the CLI, generate a component. This component is then strongly wired within the project. The approach to create a webcomponent is…


Attribute directive with Angular 6 CLI

Sometimes you want to apply the same style or behaviour to multiple DOM elements. For example you want to highlight a element while it's hovered with the mouse and unhighlight it when hover is removed. The bad way would be to write the logic in every component. Angular 6 has something called…


Generic component with Angular 6 CLI

The @Input() decorator in Angular 6 We will use the @Input() decorator to create a component which is kind of "dumb" it has only one purpose, display data! With dumb i mean, there should be no logic at all inside this component. The logic and the data should be mutated only from one…


Components with Angular 6 CLI

First of all, navigate to src/app/ open the app.component.html file and delete the content of it. The website should be blank. As you can see there are some files the CLI has created for us. It's the app.component.ts file, this is the main component file from our app. A app.component.css…


Getting started with Angular 6 CLI

Prerequisites Node Package Manager First of all we need a package manager called npm (node package manager). There are different ways to install npm. The easiest way is to install node which includes npm. Just recommend to follow the official website To check if the…


Angular 6 CLI tutorial and best practices

We will talk about some basics and will dive into some deeper examples. This series will be updated continuously while working on a real world enterprise project. Of course these examples are not used in the project, they are broken down to the core functions to get the idea what you can achieve…