У меня ошибка в angular2 и машинописном тексте. Имя класса AccordionGroup должно заканчиваться суффиксом Component. Он не останавливает выполнение, но показывает ошибку. Я реализовал аккордеон в angular2 и машинописном тексте. Вот мой код. Пожалуйста, помогите мне заранее спасибо.

import {Component, Input, OnDestroy} from '@angular/core';

    @Component({
      selector: 'accordion',
      template:'<ng-content></ng-content>'
    })
    export class Accordion {
      groups: Array<AccordionGroup> = [];
      addGroup(group: AccordionGroup): void {
        this.groups.push(group);
      }
      closeOthers(openGroup: AccordionGroup): void {
        this.groups.forEach((group: AccordionGroup) => {
          if (group !== openGroup) {
            group.isOpen = false;
          }
        });
      }
      removeGroup(group: AccordionGroup): void {
        const index = this.groups.indexOf(group);
        if (index !== -1) {
          this.groups.splice(index, 1);
        }
      }
    }
    @Component({
      selector: 'accordion-group',
      template: `
        <div class="errors-cont" [ngClass]="{'panel-open': isOpen}">
            <div class="acc-header" (click)="toggleOpen($event)">
                <ng-content select="error-header"></ng-content>
            </div>
            <div class="acc-desc" [hidden]="!isOpen">
                <ng-content select="error-body"></ng-content>
            </div>
        </div>
      `
    })
    export class AccordionGroup implements OnDestroy {
      private _isOpen: boolean = false;
      @Input() heading: string;
      @Input()
      set isOpen(value: boolean) {
        this._isOpen = value;
        if (value) {
          this.accordion.closeOthers(this);
        }
      }
      get isOpen() {
        return this._isOpen;
      }
      constructor(private accordion: Accordion) {
        this.accordion.addGroup(this);
      }
      ngOnDestroy() {
        this.accordion.removeGroup(this);
      }
      toggleOpen(event: MouseEvent): void {
        event.preventDefault();
        this.isOpen = !this.isOpen;
      }
    }
5
Mohit 29 Июн 2016 в 10:12

2 ответа

Лучший ответ

Согласно руководству по стилю здесь: https://angular.io/guide/styleguide#style -02-03

Добавьте к имени символа обычный суффикс (например, Component, Directive, Module, Pipe или Service) для вещей этого типа.

Так что если вы измените название компонентов AccordionGroup на AccordionGroupComponent, проблема будет решена. Это относится ко всем вашим сервисам и компонентам.

5
eko 1 Авг 2017 в 11:47
Вы имеете в виду, помимо использования предложенного соглашения?
 – 
eko
1 Авг 2017 в 11:46
4
Ага. Нашел: tslint.json {"суффикс-класса-компонента": false}
 – 
Ben Taliadoros
1 Авг 2017 в 11:53

.eslintrc.json

Я использовал это

 "rules": {
      
        "@angular-eslint/component-class-suffix": [
          "error",
          {
            "suffixes": [
              "Page",
              "Component"
            ]
          }
        ]
      }
3
Sampath 21 Янв 2022 в 18:16