Setting up various log levels in ngx-logger

I am working on an Angular project and interested in incorporating the ngx-logger framework to customize logging levels for specific components or classes.

For example, if my Angular application consists of 5 different components or classes and the Root level is set to INFO by default. I would like the ability to switch the logging level to DEBUG for only one specific component or class. This way, I will receive debug messages exclusively for that particular component or class without affecting the rest. Is it feasible to achieve this?

This functionality is akin to Java's Log4j, which enables users to configure distinct log levels for certain packages.

If ngx-logger does not offer this capability, do you happen to know of any other Angular logging frameworks that cater to such requirements?

Answer №1

The logger's log level is specific to its instance, so if you want different log levels for various components/modules, you'll need to create separate instances.

Here's an example for a component:

import { Component } from "@angular/core";
import { NGXLogger, NgxLoggerLevel } from "src/public_api";

@Component({
  templateUrl: './local-provider.component.html',
  providers: [NGXLogger],
})
export class LocalProviderComponent {

  constructor(public logger: NGXLogger) {
  }

  log(): void {
    this.logger.debug('Test');
  }

  changeLogLevel(): void {
    const config = this.logger.getConfigSnapshot()
    config.level = config.level === NgxLoggerLevel.TRACE ? NgxLoggerLevel.ERROR : NgxLoggerLevel.TRACE;
    this.logger.updateConfig(config);
  }
}

You can find the full example on the repository page here: https://github.com/dbfannin/ngx-logger/tree/master/projects/not-a-singleton

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Facing the dreaded "ECONNREFUSED" error when trying to connect NodeJS and InfluxDb

I'm encountering an issue when trying to connect to my InfluxDB instance running in a Docker container. To get the InfluxDB image, I used the following command: docker pull influxdb:2.4.0 When I run it locally using Docker Desktop, everything works ...

Utilize zimJS within an Angular 4 application written in Typescript

After extensive searching, I have come up empty-handed in my quest to find the answer. There are no modules available for zimjs, only for createjs, but I require the entire package. I have exhausted all resources and still cannot find a solution. I am ke ...

Error in TypeScript: The type 'event' is lacking the following properties compared to type 'KeyboardEvent'

I've created a custom event listener hook with the following structure: const useEventListener = ( eventName: string, handler: ({key} : KeyboardEvent) => void, ) => { const savedHandler = useRef<({key} : KeyboardEvent) => void>(ha ...

WebStorm lacks support for TypeScript's `enum` and `readonly` features

When working with TypeScript in WebStorm, I encountered an issue where the IDE does not recognize enum or readonly. To solve this problem, I delved into TypeScript configuration files. I am currently utilizing .eslintignore, .eslintrc, tsconfig.json, and ...

A more efficient approach to specifying types for the 'navigation' object in React Native's Stack Navigator

Struggling with modularizing prop types in React Navigation, particularly when using TypeScript. The Typescript section of the React Navigation documentation suggests defining types for each screen props in this manner: //types.ts export type RootStackPara ...

Error occurred when calling the create() method with Prisma

Despite encountering an environment variable not found error, I have a similar code example where the database connection works fine. Here is the function and model: model sdk_error { view_id String @id message String timestamp DateTime } con ...

Tips for styling the Button component in the shadcn/ui library for maximum impact

I'm currently working on a project using the shadcn/ui library. How can I properly customize it to meet my specific needs? For example, let's say I require an extra large red rounded Button for a call-to-action button in my project. What would be ...

Having difficulty in correctly formatting the material button and implementing underlines exclusively on tab names with Angular

I am struggling to properly display an Angular Material button and I also need to customize the appearance of an Angular tab. Below is a breakdown of my code. routes.component.html:: <div class="content-wrapper"> <div class=" ...

Transition from using Observable to BehaviorSubject

I have an observable with a condition attached to it: let data$: Observable<DataModel[]>; this.httpClient.get<DataModel[]>>(`data`) .pipe(map((result: DataModel[]>) => this.data$ = result)); let result: boolean = this.data$.pipe( ...

Guide to integrating a Three.js loader into an Angular 6 application

Is there a way to extend the type definitions imported into an ng6 project using Three.js (@types/three/index) with additional functions that can be directly attached to the same "namespace"? For example, THREE.myFunction(). It is important that I do not w ...

What is the best way to combine properties from Type1 and Type2 to create a new type in Typescript?

Here is a snippet of code I'm working with: interface Notification { message: TemplatedEmail & Email, //current attempt which doesnt do what I want } interface Destination { ccAddresses?: string[], bccAddresses?: string[], toAddresses: st ...

Failed to compile Angular project - Module is missing

I attempted to launch an Angular project, but encountered failure. Upon running "ng serve --open" in my project, the following information was displayed: ** Angular Live Development Server is listening on localhost:4200, open your browser on http://localh ...

The power of TypeScript generics within functional React components

I'm working with a functional component that accepts a generic type U. I need to figure out how to access the keys and values of U in order to utilize them in another generic. The CellBase and Matrix components are part of the 'react-spreadsheet& ...

Tips for ensuring your controls function properly and seamlessly when switching to another page

I utilized the instructions from this post to implement a slider. However, I encountered an issue with the controller when navigating to subsequent pages. While the controller functions correctly on the initial page, it duplicates the same values on the fo ...

Conditional application of Angular animations is possible

After implementing the fadein effect from Angular-Animations in my ASP.NET based Angular project, I encountered an issue where only the first row is faded-in while the other rows are not displayed when using *ngIf. Here is a snippet of the code: <ng-te ...

Creating a specialized Angular pipe to filter arrays

My data includes arrays of Requirement and Product objects. Each requirement has a one-to-many relationship with products, meaning each requirement can have multiple associated products. By accessing the requirement.id value in a product object, we can det ...

Transforming a "singular or multiple" array into an array of arrays using TypeScript

What is causing the compilation error in the following code snippet, and how can it be resolved: function f(x: string[] | string[][]): string[][] { return Array.isArray(x[0]) ? x : [x]; } Upon inspection, it appears that the return value will constantly ...

Utilizing a nested interface in Typescript allows for creating more complex and

My current interface is structured like this: export interface Foo { data?: Foo; bar?: boolean; } Depending on the scenario, data is used as foo.data.bar or foo.bar. However, when implementing the above interface, I encounter the error message: Prope ...

Errors encountered when using TypeScript with destructured variables and props not being recognized

I have a function that returns data. The object is structured with properties such as headerMenu, page, content, and footer. These properties are defined in DataProps interface. When I try to destructure the data object using the line: const { headerMenu, ...

Can the automatic casting feature of TypeScript be turned off when dealing with fields that have identical names?

Imagine you have a class defined as follows: Class Flower { public readonly color: string; public readonly type: string; constructor(color: string, type: string) { this.color = color; this.type = type; } Now, let's introduce anoth ...