Правила написания кода (Angular)

Документация по именованию и т.д.

Именование

 

  • savedTheDay – ивенты (события, т.е. те что прописываются в @Output) в прошедшем времени, так показано в примерах оф.документации.
  • handleUpdateUser, handleUserData, handleActionClick
  • handleUpdateUser, handleUserData, handleActionClick – приставка handle в начале названия метода, что вешается на событие (обработчика событий). В документации также присутствует рекомендация использовать on вместо handle (onUpdateUser и т.д.), но в сообществе говорят, что об этом было много разговоров и лучше его не использовать.

 

  • carouselRef – имя шаблонной ссылки с окончанием Ref.
  • containertpl – темплейтреф (TemplateRef применяется для вставки темплейта в темлейт или другого управления темплейтом по ссылке) с окончанием tpl.

Порядок атрибутов внутри тега

<div
   *ngIf="isDataLoaded"
   class="this-is-some-meaningful-block"
   *ngFor="let users of usersList"
   #elementRef
   [(name)]="contactPerson"
   [type]="data"
   []=""
   []=""
   (click)="handelClose()"
   (click)="handelClose()"
 >

*NgIf превыше всего и идет в самом начале. А *ngFor уже после названия класса. Двусторонне связывание ([(…)]) не точно стоит превыше одностороннего, но скорее всего так (логически).

Порядок свойств и методов внутри класса

// most important variables
  public CONSTANTS = CONSTANTS;
  public i18n = i18n;

  // defining variables for ex selects
  @Input() asdasd
  @Input() asdasd
  @Input() asdasd

  // possible separates by semantical purposes
  @Input() asdasd
  @Input() isLoad!: boolean;
  @Output() sdfsdf = new EventEmitter<string>()
  @Output() sdfsdf2 = new EventEmitter<string>()

  public sdfsdf
  public sdfsdf
  public sdfsdf

  private sdfsdf
  private sdfsdf
  private sdfsdf

  @ViewChild
  @ViewChild
  @ViewChild
  @ContentChildren

  // constructor detaches  variables and methods
  constructor() {}

  ngOnInit(){
    this.getData();
  }

  afterViewInit() {}

  ngOnDestroy(){}

  public getData() {
    this.calculate()
  }

// public methods
  
  public sdfsdf() {

  }

  public some() {

  }

  public some() {}

  public some() {}
 // private methods
  private calculate() {}

Сразу идут паблик свойства, потом приват свойства.  Аналогично и с методами, которые пишутся после конструкторов и жизненных циклов (хуков).

Именование классов

Это пример с конкретного проекта, а не вообще:

Именование стилей пример

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *