Angular: Create a multiple checkbox component that is suitable for reusing

Angular: Create a multiple checkbox component that is suitable for reusingLet's create Angular component to create multiple checkboxes from a specific logical group. The component will be written with ideas for reuse. What does it mean? Let's give an example below:
 
 
Imagine before you the task of making user editing. When you edit it, it usually opens a form with all fields. The user can have one or multiple roles from the list Adimin, Director, Professor, Student.
 
 
To implement multiple choice of roles, it was decided to draw on the form one checkbox for each role. Putting a tick or removing the user's role will change.
 
 
To start, let's create a ...
+ 0 -

WebSockets in Angular: create an Angular Service for working with

WebSockets in Angular: create an Angular Service for working withwebcams. In this article, I'll try to cover in detail the narrow scope of the technology application within the framework of the Angular framework and its already integral help - RxJs, and we will not intentionally touch on server implementations, because this is a full-fledged topic for a separate article.  This text will be useful to those who are already familiar with Angular, but want to deepen their knowledge directly on the topic.  Wikipedia , WebSocket is a "duplex protocol (can transmit and receive simultaneously) over a TCP connection, intended for the exchange of messages between the browser ...
+ 0 -

Visualization of data using Angular and D3

D3.js is a jаvascript library for manipulating documents based on input data. Angular is a framework that boasts high data binding performance.
 
 
Below I will consider one good approach to using all this power. From D3 simulations to SVG injections and the use of template syntax.
 
 
Visualization of data using Angular and D3
 
Demo: positive numbers up to 300 connected to their divisors.
 
https://github.com/lsharir/angular-d3-graph-example (recently updated to Angular 5)
 
The demo: https://lsharir.github.io/angular-d3-graph-example/
 
 
[h2] How to easily make such ...[/h]
+ 0 -

The history of the birth of online search service and booking of author's travels around the world: the word from the developer

How it all started
 
Ideological flour
 
Technology and how they are not unique
 
How to store and where?
 
Not only to store, but also to look for
 
This mysterious SEO
 
Our CDN is all
 
Let's sum up
 
 

How it all started


 
I want to share our semiannual history of creating an online search service and booking author's travels around the world. When creating this article, the goal was to tell about the experience of creating your own solution from scratch and those problems and challenges that we faced along the way, so do not judge strictly.
 
 
I'll st...[/h]
+ 0 -

Shopkeeper 4.0 - Online store on Symfony + Angular + MongoDB

Shopkeeper 4.0 - Online store on Symfony + Angular + MongoDB  
 

History


 
A little background. The first version of Shopkeeper was released in 2009. Then it was a module for CMS MODX , or rather for its first branch, which is now called Evolution. At that time MODX had only one such module, but its quality did not suit me, so I decided to write my own. Plus, I needed some kind of project to increase my experience in programming in PHP. Because there was almost no competition, my component became the most popular for that version of MODX.
 
???-pl3 - The latest version of Shopkeeper from the ...[/h]
+ 0 -

Angular6. PWA. Lazy loading modules. Auto-deploy in Firebase

Angular 6 allows you to create literally several commands for the Progressive Web Application (PWA), create layout for navigation pages, tables, dashboard.
 
Angular6. PWA. Lazy loading modules. Auto-deploy in Firebase Angular Essential , which includes the extension Angular v6 Snippets , with which you can start typing:
 
ex-node-
 

 
Accept the proposed snippet, specify the desired port and the folder in which the files are located for display. And that's all. You can run:


 
    node server.js    

 

Our application is available ...

+ 0 -

Angular: ngx-translate. We improve the infrastructure using Webpack

Angular: ngx-translate. We improve the infrastructure using WebpackGood day.
 
It's time to ngx-translate lifhak. Initially, I planned 3 parts, but because the second part is in fact little informative - in this I will try to summarize the 2nd part as briefly as possible.
 
read 1
 
Consider AppTranslateLoader in the replacement of TranslateHttpLoader . Our AppTranslateLoader will primarily pay attention to the language of the browser and contain fallback logic, import the localization of MomentJs, and perform the download via APP_INITIALIZER. As a result of the merger of the two parts of the lifhaks, along the way, we will delve into the ...
+ 0 -

What we read in May: Ivy reviews, Nest 5 release and other useful texts for Angular developers

What we read in May: Ivy reviews, Nest 5 release and other useful texts for Angular developers
 
For those who are ready not only to eat shish kebab on a long weekend, but also to read all sorts of necessary texts, I collected the top ten links from the Vimbox development channel in the corporate Skyeng Slack. As well as the last time, the selection is concentrated around the Angular framework and will be interesting to the programmers working with it.
Ivy engine in Angular: first look at compilation, runtime and change detection
 
Excellent parsing of the upcoming Ivy renderer: in general terms it is painted, why do it at all, and how it works inside.
 
"Before we move on to the details ...
+ 0 -

Angular cli 6: what is needed and how to use

Angular cli 6: what is needed and how to use
 
 
Hello!
 
 
The version of Angular ??? was released in September 2016. And immediately appeared a large number of approaches to building and building applications on this framework. On the Internet, you can find the Angular seed for every taste.
 
 
We also created our own Angular seed: we created a common project-template, ordered all the teams developing the front-end to use one application structure.
 
 
And in half a year, in March 201? the version of Angular cli (cli-command-line interface) ??? was released. The idea, taken as a basis, is simply excellent: to systematize the approach to developing ...
+ 0 -

As I migrated the project with Angular 1 on React

Hello!
 
I want to share my experience and tools that I used to migrate the project with Angular 1 on React .
 
TLTR:
I wrote module , with which you can transform the Angular components (controller + template) into React components.
ngReact , but there was no special desire to turn the project into such a monster of Frankenstein. Therefore, it was decided to move the project to React to simplify its development and support.
 
What was
 
The main project is
 
 
The project on Angular ???? angular-ui-router, angular-ui (modal windows, calendars)
 
60/40 - Typescript /ES2015 ...
+ 0 -