Question

在读取/写入日期选择器时，我定义了将年，月，日解析为日期格式的函数。我想创建一个静态类，以在项目的任何地方将这些功能用作Utility类。这样做时，我遇到了NgbDateParserFormatter DI令牌的挑战，因为我在类中的方法在下面的代码中是静态amd，因此this.ngbDateParserFormatter不确定。尽管当在组件内部使用此代码时，整个代码工作正常，因为this.ngbDateParserFormatter在此处不为null。即使我在外部将其定义为“静态”，也仍然未定义。因此，如何将此标记注入实用程序类。

import { Component, Injectable } from '@angular/core';
import {NgbDateParserFormatter, NgbDateStruct, NgbModal, NgbDate } from 
'@ng-bootstrap/ng-bootstrap';
import { DatePipe } from '@angular/common';


export class DateFormatHelper {

 static datePipe = new DatePipe('en-US');


  constructor(private ngbDateParserFormatter: NgbDateParserFormatter) {
 }

 static formatedDate(val: any): any {
 const bDate = val;
  return this.ngbDateParserFormatter.format(bDate);
 }

 static parsengbDate(value: string): NgbDateStruct {
 let returnVal: NgbDateStruct;

  if (!value) {
   returnVal = null;
  } else {
       try {
       const dateParts = this.datePipe.transform(value, 'MM-dd- 
        yyyy').split('-');
       returnVal = { year: Number(dateParts[2]), month: 
       Number(dateParts[0]), day: Number(dateParts[1]) };
     } catch (e) {
       returnVal = null;
     }
   }
    return returnVal;
  }

Answer 1

NgbDateParserFormatter永远不会被注入，因为注入仅适用于由Angulars依赖注入（DI）实例化的类。

为解决您的问题，我建议使用所需的所有方法创建一个可注入服务，然后将其注入需要其方法的每个组件中。

您可以看到本教程来使用它们here，但是看起来像这样：

import { Component, Injectable } from '@angular/core';
import {NgbDateParserFormatter, NgbDateStruct, NgbModal, NgbDate } from '@ng-bootstrap/ng-bootstrap';
import { DatePipe } from '@angular/common';
import { Injectable } from '@angular/core';

@Injectable({
  providedIn: 'root',
})
export class DateFormatHelper {
  private datePipe = new DatePipe('en-US');
  constructor(private ngbDateParserFormatter: NgbDateParserFormatter) {
  }

 public formatedDate(val: any): any {
 const bDate = val;
  return this.ngbDateParserFormatter.format(bDate);
 }

 public parsengbDate(value: string): NgbDateStruct {
  let returnVal: NgbDateStruct;

  if (!value) {
   returnVal = null;
  } else {
     try {
       const dateParts = this.datePipe.transform(value, 'MM-dd- 
        yyyy').split('-');
       returnVal = { year: Number(dateParts[2]), month: 
       Number(dateParts[0]), day: Number(dateParts[1]) };
     } catch (e) {
       returnVal = null;
     }
   }
    return returnVal;
  }
}

P.S。请记住将NgbDateParserFormatter作为提供者添加到模块中以注入它们（不是DateFormatHelper，因为我已经在@Injectable元数据中注册了它）。要了解注入工作原理，请看here

如何在实用程序类中注入ng-bootstrap NgbDateParserFormatter

1 个答案: