Hide action bar in NativeScript Angular

Question

From NativeScript official documentation:

Тhе actionBarVisibility is a property that controls the visibility of the Navigation Bar in iOS and the Action Bar in Android for the current Frame. It should be set directly to the Frame and has three option values auto, never, always.

<Frame id="my-frame-id" actionBarVisibility="never" defaultPage="home/home-page"/>

But I found no Frame tag in NativeScript Angular.

Where can I found it? Or how do I hide action bar in NativeScript Angular?

Answer 1

You can add the actionBarVisibility to the page-router-outlet element in the app.component.html like the snippet below:

<page-router-outlet actionBarVisibility="never"></page-router-outlet>

To hide it for specific pages you can set the actionBarHidden property of the Page class like the snippet below:

import { Page } from '@nativescript/core';

@Component({
...
})
export class MyComponent {
  constructor(private page: Page) {
    page.actionBarHidden = true;
  }
}