Breadcrumb

面包屑 https://angular.carbondesignsystem.com/?path=/story/components-breadcrumb—basic

组件及属性

• breadcrumb
  • Input
    • items: Array
    • noTrailingSlash
    • ariaLabel: string;
    • skeleton
    • threshold
  • Output
    • navigation
• breadcrumb-item
  • Input
    • href
    • route
    • routeExtras
    • skeleton
    • ariaCurrent = “page”
  • Output
    • navigation
  • Hostbinding
    • class.bx—breadcrumb-item—current, @Input current = false
    • class.bx—breadcrumb-item, itemClass= true

      Tips

      DomSanitizer

      DomSanitizer helps preventing Cross Site Scripting Security bugs (XSS) by sanitizing values to be safe to use in the different DOM contexts.

DomSanitizer 用于阻止跨站脚本攻击，通过净化值的方式，能够在各种 DOM 上下文中使用。

abstract class DomSanitizer implements Sanitizer {
  abstract sanitize(context: SecurityContext, value: string | SafeValue): string | null
  abstract bypassSecurityTrustHtml(value: string): SafeHtml
  abstract bypassSecurityTrustStyle(value: string): SafeStyle
  abstract bypassSecurityTrustScript(value: string): SafeScript
  abstract bypassSecurityTrustUrl(value: string): SafeUrl
  abstract bypassSecurityTrustResourceUrl(value: string): SafeResourceUrl
}

参考

• https://medium.com/@swarnakishore/angular-safe-pipe-implementation-to-bypass-domsanitizer-stripping-out-content-c1bf0f1cc36b

• https://angular.io/api/platform-browser/DomSanitizer

  @Optional()

  可选依赖，注意判断 null
  参考

• https://v7.angular.cn/guide/dependency-injection#optional-dependencies

  ? ! 语法

  ?, 安全链式调用
  !, 强制链式调用
  参考

• https://github.com/e2tox/blog/issues/9

  Code

  感谢

  朋友你好，如果你对我的文章感兴趣，欢迎关注我的 Github (https://github.com/llccing)，或者掘金 (https://juejin.cn/user/3227821867281079)，或者语雀 (https://www.yuque.com/uov16w)，感谢你的支持！