импорт компонентов в ngx-bootstrap выдает ошибку "неизвестный элемент"

Я импортировал datepicker, и он отображается нормально.

Но когда я пытаюсь импортировать напечатанный текст, кнопки или что-то еще, я получаю ошибку <whatever> is not a known element.

Я импортирую модуль в app.module вот так:

import {DatepickerModule} from 'ngx-bootstrap/datepicker';
import { TypeaheadModule } from 'ngx-bootstrap/typeahead';
import { ButtonsModule } from 'ngx-bootstrap/buttons';
// also tried:
// import { DatepickerModule, TypeaheadModule... } from 'ngx-bootstrap';
// ..but again no luck
...
imports: [
   DatepickerModule.forRoot(), //only this works 
   TypeaheadModule.forRoot(),
   ButtonsModule.forRoot(),
   ...]

Затем на моем history.module таким же образом с той лишь разницей, что .forRoot() теперь опущен.

Затем в дочернем компоненте родительского компонента истории у меня есть:

<span *ngIf="showFilters" class="value bootstrap-iso" >
  <div style="display:inline-block;">
    <datepicker
      [(ngModel)]="dt"
      [datepickerMode]="'month'"
      [showWeeks]="false"
      [dateDisabled]="dateDisabled"
      [maxDate]="today">
    </datepicker> 
  </div>
</span>

который работает, но, например, они не работают:

<typeahead [typeahead]="'documents'"></typeahead>  
<btnCheckbox></btnCheckbox>

Неважно, включаю ли я ngModel или другие атрибуты, я всегда получаю ошибку неизвестного элемента. Поэтому я предполагаю, что это связано с моим импортом, моим именованием или чем-то еще, но, честно говоря, я не вижу, чего не хватает.

РЕДАКТИРОВАТЬ: Используя Angular 4, "@angular/cli": "1.1.1", "ngx-bootstrap": "^1.7.1", "bootstrap": "^4.0.0-alpha.6", "typescript": "~2.3.3"


person gkri    schedule 14.07.2017    source источник


Ответы (2)


Что ж, мне действительно нужно добавить input, показанный в разделе template документации.

Итак, это работает:

<input [(ngModel)]="selected"
    [typeahead]="documents"
    class="form-control">

Поскольку в документации упоминаются Selector и Exported as, я подумал, что мы должны использовать эти значения. Я думал, что шаблоны просто показывают, как компоненты работают под капотом.

person gkri    schedule 18.07.2017

Как сказал мой коллега, добавьте, пожалуйста,

import {FormsModule, ReactiveFormsModule} from '@angular/forms';
person jayanthCoder    schedule 12.06.2018