I'm writing an app, it has page1, page2, page3, all with components. I have one config.service.ts file setting the debug mode to a boolean.

In my views, I will (or not depending on this setting) show buttons/messages/etc. 

What is the best practice ? Because both are possible:

1. declare `configService` as public in all my components, then in the view directly use: 

```html
*ngIf="configService.getIsDebugMode()" 

```

or
2. create a function in each component named `getIsDebugMode()` that asks the service for to know if we are in debug mode ?

```js
getIsDebugMode():boolean {
    return this.configService.getIsDebugMode();
}

```

and then in my views call the component function:

```html
*ngIf="getIsDebugMode()" 

```

I think 2 is cleaner, but it makes me write three (or more if more pages) times the same function in all of my components... which seems like some kind of bad practice...

And I like to make it the right way, so any help will be appreciated.