Как сделать директиву глобальной, чтобы ее можно было использовать в любом месте страницы, не полностью контролируемой angular 2

Есть ли способ сделать директиву глобальной? мне нужно, чтобы он был добавлен из любой точки на странице, не полностью контролируемой Angular 2, например: я хочу создать (средство выбора даты, сетка или список изображений и т. д.), созданный Angular 2, а затем использовать этот компонент в любом месте на созданной странице другими обрамлениями, похожими на этот вид HTML:

<body>
    <label>birth of date</label>
    <input type= "text" id='dob' angular2datetimepicker  >
    <label>Join Date</label>
    <input type= "text" id= 'jod' angular2datetimepicker  > 
</body>

куда angular2datetimepicker является компонентом или пользовательской директивой, созданной в угловом 2, но используемой вне углового 2 контекста.

Источник

1 ответ

Вы могли бы bootstrap это с помощью PLATFORM_DIRECTIVES:

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

import {PLATFORM_DIRECTIVES} from 'angular2/core';
import {OtherDirective} from './myDirectives';
@Component({
  selector: 'my-component',
  template: `
    <!-- can use other directive even though the component does not list it in `directives` -->
    <other-directive></other-directive>
  `
})
export class MyComponent {
  ...
}
bootstrap(MyComponent, [provide(PLATFORM_DIRECTIVES, {useValue: [OtherDirective], multi:true})]);

Пример запуска ниже:

import {bootstrap}    from 'angular2/platform/browser';
import {PLATFORM_DIRECTIVES, provide}    from 'angular2/core';
import {HighlightDirective} from './highlight.directive';
import {AppComponent} from './app.component';

bootstrap(AppComponent, [
        provide(PLATFORM_DIRECTIVES, {useValue: HighlightDirective, multi: true})
]);

Смотрите демо плункер здесь.

Источник
Другие вопросы по тегам