c0d3a019c2
**Pipes Sample Code** Migrated all sample code in the `examples/pipes` folder. Did not touch the pipes in the ToH or Testing folders. >The existing, complex discussion of the `CurrencyPipe` within `pipes-transform-data.md` cried out for a new `concurrency-formatting.component` example`. **Extracted "pipe precedence" into its own page** The topic had been extracted from `pipe.md` and tacked on to the bottom of the `pipes-overview.md` page. It's an advanced and somewhat obscure topic that doesn't belong in the overview. Rather than throw it away, I created a new `pipe-precedence.md` page and added it to the bottom of the pipes section navigation. I also tried to improve both the guide text and the companion component, `precedence.component`. **How to create a pipe is missing** The readers are told they can create their own pipes in several places throughout the docs. But there are no links and you can't navigate to a page that covers the topic. This is a serious omission! The topic is introduced in the `pipes-custom-data-trans.md` page (extracted verbatim from `pipes.md`). But you can't navigate to this page and their are no links to it. TODO: restore this page and add it to the left-nav. **Change `pipes.md` references to `pipe-overview.md`** The original, kitchen-sink page, `pipes.md`, was disconnected from navigation long ago, in favor of multiple pages such as `pipe-overview.md`. The page is still in the AIO documentation and can be found by searching or by links from 3rd party documenters. Landing on that page hides the left-nav. In this commit, we treat `pipes.md` as deprecated (which it seems to be). Therefore, this commit retargets previous `pipes.md` references to `pipe-overview.md`. >The `change-detection-slow-computations.md` is the exception. It refers to "pure pipes", a subject not covered in the current pipe documentation. That reference is retargeted to `api/core/Pipe#pure`. Certain code files are only referenced in `pipe.md`. They still work and are displayed in the overall pipes code sample as before. Now they are marked with deprecation comments for future treatment or removal. For consistency, certain sections of `pipes.md` were replaced by the contents of the corresponding current pages. PR Close #51333
1 KiB
Pipe precedence in template expressions
Sometimes you want to choose between two values, based on some condition, before passing the choice to the pipe. You could use the JavaScript ternary operator (?:) in the template to make that choice.
Beware! The pipe operator has a higher precedence than the JavaScript ternary operator (?:).
If you simply write the expression as if it were evaluated left-to-right, you might be surprised by the result. For example,
condition ? a : b | pipe
is parsed as
condition ? a : (b | pipe)
The value of b passes through pipe; the value of a will not.
If you want the pipe to apply to the result of the ternary expression, wrap the entire expression in parentheses. For example,
(condition ? a : b) | pipe
In general, you should always use parentheses to be sure Angular evaluates the expression as you intend.
The "Pipes and Precedence" section of the pipes example explores this issue in more detail.
@reviewed 2023-08-14