I'm using Bootstrap Tags Input as a component for my Angular 2 project. I can use jQuery directly after did import but Bloodhound can't. The Typescript compiler said: "Cannot find name 'Bloodhound' "
I have loaded required libraries from node_modules/
like this:
baBootstrapTags.loader.ts
// require('style-loader!bootstrap-css/dist/css/bootstrap.min.css')
require('style-loader!bootstrap-tagsinput/dist/bootstrap-tagsinput.css')
require('style-loader!bootstrap-tagsinput/dist/bootstrap-tagsinput-typeahead.css')
require('bootstrap-tagsinput/dist/bootstrap-tagsinput.js');
require('typeahead.js');
require('typeahead.js/dist/typeahead.bundle.min.js'); //<-- It's already contain Bloodhound define.
baBootStrapTags.component.ts
import {Component, OnInit, ViewEncapsulation, Input} from '@angular/core';
import './baBootStrapTags.loader.ts';
@Component({
selector: 'ba-tags-input',
template: require('./baBootStrapTags.html'),
encapsulation: ViewEncapsulation.None,
})
export class BaBootStrapTags implements OnInit {
cities: Bloodhound; // <----- ERROR HERE
@Input() config:Object = {
itemValue: 'value',
itemText: 'text',
typeaheadjs: {
name: 'cities',
displayKey: 'text',
source: this.cities.ttAdapter()
}
};
}
Has anyone ever used Bloodhound (Typeahead) in Angular2? How do I declare new Object from external libraries?