Show and Hide with Alternative Templates
Explore techniques for managing element visibility in Angular by leveraging the NgIf directive with alternative templates. Understand how to implement custom directives that conditionally display content or replace it with alternative views, enhancing code readability and functionality for different user accounts.
We'll cover the following...
In this chapter, we discuss some practical ways we can make use of directives in our daily Angular-related challenges. We’ll learn three techniques that will build on what we already know.
In this lesson, we’ll improve a previous directivewith a custom NgIf directive implemented for premium and standard users. This particular directive is very handy when we need to implement many NgIf directives that use similar logic.
We don’t duplicate the directive across all components. We simply wrap it in a directive. However, there’s one feature of NgIf missed in implementation,that could be handy in many cases. Let’s start with a quick example.
Alternative template
It’s common to show and hide particular elements on the page depending upon the specific type of account. But, do we always only want to show or hide the element?
Sometimes, when account-type criteria are not met, we ...