Summary

In this chapter, we explored the structure of Angular components and different ways to create them. We learned how to create a standalone component or register it with an Angular module. We discussed how to isolate the component's HTML template in an external file to ease its future maintainability. Also, we saw how to do the same with any style sheet we wanted to bind to the component in case we did not want to bundle the component styles inline. We also learned how to use the Angular template syntax and interact with the component template. Similarly, we went through how components communicate in a bidirectional way using property and event bindings.

We were guided through the options available in Angular for creating powerful APIs for our components, so we can provide high levels of interoperability between components, configuring its properties by assigning either static values or managed bindings. We also saw how a component can act as a host component for another child...