Skip to content
This repository has been archived by the owner on Nov 29, 2023. It is now read-only.

Implementation best practices

Victor Dias edited this page Aug 8, 2018 · 6 revisions

The aim of this doc is to precise already well-know styleguide as Angular

Naming services

import { AnalyticsService } from '@shared/analytics.service';
import { AuthService } from '@providers/auth.service';

constructor ItemsComponent (
    analyticsService: AnalyticsService,
    authService: AuthService
) {}
/* WRONG */
private profileService: ContactsService
/* OK */
private contactsService: ContactsService

a single identifier should only be used to represent a single concept

Constructor vs ngOnInit

ngOnInit is part of Angular lifecycle, while constructor is part of ES6 JavaScript class. Mostly we use ngOnInit for all the initialization/declaration and avoid stuff to work in the constructor. The constructor should only be used to initialize class members but shouldn't do actual "work". So you should use constructor() to setup Dependency Injection and not much else.

Sources:

Mock: mimic an Observable

Observable.of from RxJS to give an Observable stream from the results, this is a nice way to mimic an Observable response. => Could be use to mock contacts or comments.

this.contacts = Observable.of([ { "id": 1, "name": "Laura", "email": "[email protected]", "age": 47 }, ...

How to submit form on Angular

/* WRONG */
<form novalidate (ngSubmit)="onSubmit(f)" #f="ngForm">
/* OK */
<form novalidate (ngSubmit)="saveProfile(user)" #f="ngForm">