mirror of
https://github.com/angular/angular.git
synced 2026-09-14 13:54:52 +08:00
Joe Martin (Crowdstaffing)
bf1294ba69
Apply editorial suggestions for peer review. Co-authored-by: Tiffany Davis <88161089+TMDavisGoogle@users.noreply.github.com> PR Close #45325
62 lines
1.4 KiB
Markdown
62 lines
1.4 KiB
Markdown
@name Invalid Banana-in-Box
|
|
|
|
@description
|
|
|
|
This diagnostic detects a backwards "banana-in-box" syntax for [two-way bindings](guide/two-way-binding).
|
|
|
|
<code-example format="html" language="html">
|
|
|
|
<div ([var])="otherVar"></div>
|
|
|
|
</code-example>
|
|
|
|
## What's wrong with that?
|
|
|
|
As it stands, `([var])` is actually an [event binding](guide/event-binding) with the name `[var]`.
|
|
The author likely intended this as a two-way binding to a variable named `var` but, as written, this binding has no effect.
|
|
|
|
## What should I do instead?
|
|
|
|
Fix the typo.
|
|
As the name suggests, the banana `(` should go *inside* the box `[]`.
|
|
In this case:
|
|
|
|
<code-example format="html" language="html">
|
|
|
|
<div [(var)]="otherVar"></div>
|
|
|
|
</code-example>
|
|
|
|
## Configuration requirements
|
|
|
|
[`strictTemplates`](guide/template-typecheck#strict-mode) must be enabled for any extended diagnostic to emit.
|
|
`invalidBananaInBox` has no additional requirements beyond `strictTemplates`.
|
|
|
|
## What if I can't avoid this?
|
|
|
|
This diagnostic can be disabled by editing the project's `tsconfig.json` file:
|
|
|
|
<code-example format="json" language="json">
|
|
|
|
{
|
|
"angularCompilerOptions": {
|
|
"extendedDiagnostics": {
|
|
"checks": {
|
|
"invalidBananaInBox": "suppress"
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
</code-example>
|
|
|
|
See [extended diagnostic configuration](extended-diagnostics#configuration) for more info.
|
|
|
|
<!-- links -->
|
|
|
|
<!-- external links -->
|
|
|
|
<!-- end links -->
|
|
|
|
@reviewed 2022-02-28
|