Update Angular.dev Docs: Address 'card-title' and 'card-body' Error in Multiple Content Placeholders Example

[surajchopra16]

Describe the problem that you experienced

Example:

This is an example from the Angular.dev docs demonstrating Multiple content placeholders

<!-- Component template -->
<div class="card-shadow">
  <ng-content select="card-title"></ng-content>
  <div class="card-divider"></div>
  <ng-content select="card-body"></ng-content>
</div>

<!-- Using the component -->
<custom-card>
  <card-title>Hello</card-title>
  <card-body>Welcome to the example</card-body>
</custom-card>

Error:

'card-title' is not a known element:

1. If 'card-title' is an Angular component, then verify that it is included in the '@Component.imports' of this component.
2. If 'card-title' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@Component.schemas' of this component to suppress this message.ngtsc(-998001).

'card-body' is not a known element:

1. If 'card-body' is an Angular component, then verify that it is included in the '@Component.imports' of this component.
2. If 'card-body' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@Component.schemas' of this component to suppress this message.ngtsc(-998001).

Missing Example:

There is no example about Conditional Content Projection.

Enter the URL of the topic with the problem

https://angular.dev/guide/components/content-projection#multiple-content-placeholders

Describe what you were looking for in the documentation

I'm looking for information about multiple content placeholders in components and conditional content projection in Angular.dev new documentation.

Describe the actions that led you to experience the problem

No response

Describe what you want to experience that would fix the problem

No response

Add a screenshot if that helps illustrate the problem

No response

If this problem caused an exception or error, please paste it here

No response

If the problem is browser-specific, please specify the device, OS, browser, and version

No response

Provide any additional information here in as much as detail as you can

No response

[geromegrignon]

This guide is not meant to be a tutorial in my mind. The related snippet acts as an example.

Adding content to create both components would just create noise in this guide.

[bencodezen]

@geromegrignon is correct. These are meant as snippets to show how it could be implemented rather than working examples.

I'll make a note though that this would be a candidate for tutorial material in the future though. Thanks for the detailed issue though @surajchopra1234!

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}