angular2 style guide - property with dollar sign?

gerasalus picture gerasalus · Jun 7, 2016 · Viewed 84.8k times · Source

Parent and children communicate via a service example from the official guide on Angular.io makes use of dollar signs in Observable stream names.

Notice missionAnnounced$ and missionConfirmed$ in the following example:

import { Injectable } from '@angular/core';
import { Subject } from 'rxjs';

@Injectable()
export class MissionService {

  // Observable string sources
  private missionAnnouncedSource = new Subject<string>();
  private missionConfirmedSource = new Subject<string>();

  // Observable string streams
  missionAnnounced$ = this.missionAnnouncedSource.asObservable();
  missionConfirmed$ = this.missionConfirmedSource.asObservable();

  // Service message commands
  announceMission(mission: string) {
    this.missionAnnouncedSource.next(mission);
  }

  confirmMission(astronaut: string) {
    this.missionConfirmedSource.next(astronaut);
  }
}

Can anyone explain:

  • why $ is used? What's the reason behind this notation? Do I always need to use this for public properties?
  • public properties are used but not methods (e.g. missionAnnouncements(), missionConfirmations()) - again, is this a convention for Angular2 apps?

Answer

Monfa.red picture Monfa.red · Jun 20, 2016

$ suffix (popularized by Cycle.js) is used to indicate that the variable is an Observable. It could make it to the official style guide too but it's not there yet

Read more here : What does the suffixed dollar sign $ mean?

Update: Read more about the trailing “$” sign on Angular website here: https://angular.io/guide/rx-library#naming-conventions-for-observables