CODEWITHSUNDEEP
angular
HappyCoder
HappyCoder

Reputation: 6155

Is there a way to hide components in Angular 2?

My App components has the following components:

  <login-bar></login-bar>
  <banner></banner>
  <navbar></navbar>
  <router-outlet></router-outlet>
  <footer></footer>

I am building a page that does not require the banner and the footer. Is there a way to hide those components from the view on a custom basis?

Thank you.

Upvotes: 0

Views: 689

Answers (1)

Huske
Huske

Reputation: 9296

You can create a boolean variable in your TypeScript file and set it to false or use some method to control whether it should be visible or not. In your TypeScript file where you defined your component:

@Component({
    ... // your settings
})
export class MyComponent {

    myFuncThatReturnsBoolean(): boolean {
        // If you need some logic to determine
        // whether to turn it on or off, do it here
        // otherwise
        return false;
    }
}

And then in your HTML partial view

<footer *ngIf="myFuncThatReturnsBoolean()"></footer>

That should do the trick.

Upvotes: 1

Related Questions