Как импортировать библиотеку Javascript в angular2 глобально

Question

Я пытаюсь импортировать библиотеку moment.js в angular2. Я нашел следующее решение как:

import {Component} from 'angular2/core';
import * as moment from 'moment';

@Component({
  selector: 'app',
  template: require('./app.component.html')
})
export class AppComponent {
  moment:any = moment;
  constructor() {}
}

Однако я не хочу импортировать это в каждый компонент, который у меня есть. Есть ли способ ввести его глобально, чтобы я мог использовать его во всех моих компонентах?

Answer 1

Из того, что я прочитал здесь, я могу предоставить библиотеку momentjs при начальной загрузке всего приложения следующим образом:

import * as moment from 'moment';
import {provide} from 'angular2/core';
import {bootstrap} from 'angular2/platform/browser';

bootstrap(App, [
    provide("moment", {useValue:moment})
])

Затем я могу использовать его в своем собственном компоненте с помощью DI, например так:

import {Component, OnInit, Inject} from 'angular2/core';

@Component({
  selector: 'app',
  template: require('./app.component.html')
})
export class AppComponent {
  constructor(@Inject("moment") private moment) {}
}

Answer 2

Получите ваши компоненты из общего базового типа, который импортирует момент.

родитель

import * as moment from 'moment';

export class MomentAwareClass {
  moment:any = moment;
  constructor() {}
}

ребенок

import {Component} from 'angular2/core';

@Component({
  selector: 'app',
  template: require('./app.component.html')
})
export class AppComponent extends MomentAwareClass  {
  constructor() {}
}

Обновить

Лучше использовать Dependency Injection, чтобы написать сервис с Injectable() декоратор, это лучше, поскольку композиция предпочтительнее наследования.

import { Injectable } from '@angular/core';
import * as moment from 'moment';

@Injectable()
export class SomeClass {
    public moment: any = moment;
}