Issue
I’m using ESLint with Angular and I don’t like having extra code like (observable | async) === (false | null | undefined)
instead of just (observable | async)
. How do I disable that rule?
E:\GitHub\skybot\angular\src\app\custom-layout\custom-layout.component.html
6:75 error Async pipes should not be negated. Use (observable | async) === (false | null | undefined) to check its value instead @angular-eslint/template/no-negated-async
custom-layout.component.html
<ng-template #sidenavRef>
<vex-sidenav [collapsed]="sidenavCollapsed$ | async"></vex-sidenav>
</ng-template>
<ng-template #toolbarRef>
<vex-toolbar [hasShadow]="toolbarShadowEnabled$ | async" [mobileQuery]="!(isDesktop$ | async)" class="vex-toolbar">
</vex-toolbar>
</ng-template>
<ng-template #footerRef>
<vex-footer *ngIf="isFooterVisible$ | async" class="vex-footer"></vex-footer>
</ng-template>
<ng-template #quickPanelRef>
<vex-quick-panel></vex-quick-panel>
</ng-template>
<vex-layout [footerRef]="footerRef" [quickPanelRef]="quickPanelRef" [sidenavRef]="sidenavRef" [toolbarRef]="toolbarRef">
</vex-layout>
<vex-config-panel-toggle (openConfig)="configPanel.open()"></vex-config-panel-toggle>
<!-- CONFIGPANEL -->
<vex-sidebar #configPanel [invisibleBackdrop]="true" position="right">
<vex-config-panel></vex-config-panel>
</vex-sidebar>
<!-- END CONFIGPANEL -->
.eslintrc.json
{
"root": true,
"ignorePatterns": [
"projects/**/*"
],
"overrides": [
{
"files": [
"*.ts"
],
"parserOptions": {
"project": [
"tsconfig.json",
"e2e/tsconfig.json"
],
"createDefaultProgram": true
},
"extends": [
"plugin:@angular-eslint/ng-cli-compat",
"plugin:@angular-eslint/ng-cli-compat--formatting-add-on",
"plugin:@angular-eslint/template/process-inline-templates"
],
"rules": {
"@angular-eslint/component-selector": [
"error",
{
"type": "element",
"prefix": "vex",
"style": "kebab-case"
}
],
"@angular-eslint/directive-selector": [
"error",
{
"type": "attribute",
"prefix": "vex",
"style": "camelCase"
}
],
"@angular-eslint/no-host-metadata-property": "off",
"@typescript-eslint/explicit-member-accessibility": [
"off",
{
"accessibility": "explicit"
}
],
"arrow-parens": [
"off",
"always"
],
"id-blacklist": "error",
"import/order": "off",
"max-len": "off",
"@angular-eslint/template/no-negated-async": "off"
}
},
{
"files": [
"*.html"
],
"extends": [
"plugin:@angular-eslint/template/recommended"
],
"rules": {}
}
]
}
Solution
add "@angular-eslint/template/no-negated-async": "off"
to the html portion of the esLint rules section