登录  /  注册
首页 > web前端 > js教程 > 正文

聊聊Angular+Service如何改进日志功能

青灯夜游
发布: 2021-09-17 10:24:45
转载
1796人浏览过

如何改善angular的日志使用方式?下面本篇文章给大家介绍一下使用angular中的service管理控制台输出,改进日志功能的方法,希望对大家有所帮助!

聊聊Angular+Service如何改进日志功能

改善在Angular 应用中的日志使用方式

Angular是一个非常受欢迎的开发框架,前端开发者们喜欢在应用中使用console去调试它们的代码,但是由于持续交付/部署的需要,这些调试代码会被删除,不会进入生产发布环境中。【相关教程推荐:《angular教程》】

1.png

让 Angular 帮我们实现这个功能

Angular 为我们提供了将 Services 注册到应用中的功能,使得我们可以在组件中重用一些功能。

因此,我们可以利用Service来管理我们的控制台输出,从而改进日志功能。

1 : 使用Service来管理console

import { Injectable } from '@angular/core';
@Injectable({
  providedIn: 'root'
})
export class LogService {

  constructor() {

  }
  trace(...data: any[]): void {
    console.trace(data);
  }
  log(...data: any[]): void {
    console.log(data);
  }
}
登录后复制

AppComponent组件中使用它::

logService.log('console executed from AppComponent');
登录后复制

2.png

上面的代码很容易理解,但是有一个问题,我们无法得知日志是在应用的哪一个组件中打印的,除非我们在日志消息中表明,例如图中的日志信息表明它来自于AppComponent组件,我们希望日志的右侧能自动表明它来自哪个组件,而不是定义整个日志系统的文件位log.service.ts:xx,并且不需要我们在日志消息中手动表明。

1.1: 使用logService.trace()

它可以用于跟踪日志的来源,看起来很不错,但实际上它会添加一些不必要的日志记录。

2: logService增强版

import { Injectable } from '@angular/core';
@Injectable({
  providedIn: 'root'
})
export class LogService {

  constructor() {

  }
  trace(source: string, ...data: any[]): void {
    console.trace(data);
  }
  log(source: string, ...data: any[]): void {
    console.log(data);
  }
}
登录后复制

与前面相比,增强版的logService类的方法接收额外的参数。

logService.log('AppComponent','console executed from AppComponent');
登录后复制

3.png

很好

以上就是聊聊Angular+Service如何改进日志功能的详细内容,更多请关注php中文网其它相关文章!

智能AI问答
PHP中文网智能助手能迅速回答你的编程问题,提供实时的代码和解决方案,帮助你解决各种难题。不仅如此,它还能提供编程资源和学习指导,帮助你快速提升编程技能。无论你是初学者还是专业人士,AI智能助手都能成为你的可靠助手,助力你在编程领域取得更大的成就。
相关标签:
来源:掘金--JaylenL网
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
作者最新文章
最新问题
关于CSS思维导图的课件在哪? 课件
凡人来自于2024-04-16 10:10:18
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2024 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号