How to disable tslint rule for Angular style guide: "The selector should be prefixed by <prefix>"?

Issue

I have an Angular test for some component which uses the directive ngb-pagination from ng-bootstrap.

Now, in my test I mock this component as follow:

// on next line I get: The selector should be prefixed by "<prefix>" (https://angular.io/guide/styleguide#style-02-07) (component-selector)
@Component({ template: ``, selector: 'ngb-pagination' })
class DummyNgPagination {
    // some data here, not relevant in to the question
}

In the line where it is placed the @Component annotation I get a tslint error pointing to Style 02-07.

I tried to disable the rule by doing the following, but the result is the same.

// tslint:disable-next-line:directive-selector
@Component({ template: ``, selector: 'ngb-pagination' })

How can I disable that rule for that specific line?

PS:

• Here is the real angular project in case you want to check any resource configuration.
• There is a similar question (kebab-case in angular 2 selectors (tslint)) but the OP just decided to live with it.

Solution

The rule directive-selector works for the @Directive decorator.

For a @Component you need to use component-selector

For example:

// tslint:disable-next-line:component-selector
@Component({ template: ``, selector: 'ngb-pagination' })

Answered By - lealceldeiro