将Bloodhound导入Angular 2 CLI项目

我正在尝试将Bloodhound.js实现为使用Angular 2 CLI的Angular 2项目。目前，我已经jQuery的通过以下方式工作：将Bloodhound导入Angular 2 CLI项目

NPM中安装jQuery --save
NPM安装@类型/ jQuery的--save-dev的
然后加入“” ../node_modules/jquery/dist/jquery.min.js“'转换为angular-cli.json中的脚本数组。

” ../node_modules/bloodhound-js/dist/bloodhound.min.js：

我有以下做了Bloodhound.js相同的角cli.json以及“

不过，我得到以下错误：

找不到名称‘寻血猎犬’。

有没有办法直接导入.js文件或在本地添加导入？

来源

2017-07-09 user3565164

你有没有发现这方面的任何解决方案 –

这是我的解决方案。希望有人能帮助这个。

使用以下命令安装typehead.js类型定义。

npm install --save @types/typeahead

将以下文件也添加到angular-cli.json文件中。

"assets/js/bloodhound.min.js", 
"assets/js/typeahead.bundle.min.js"

不要在OnInit的下列（）我已经安装了jQuery的太组件

const suggestions = [{ 
      value: 'string1' 
     }, { 
      value: 'string2' 
     }, { 
      value: 'string3' 
     }, { 
      value: 'string4' 
     }, { 
      value: 'string5' 
     }]; 

let bloodhoundSuggestions = new Bloodhound({ 
     datumTokenizer: Bloodhound.tokenizers.obj.whitespace('value'), 
     queryTokenizer: Bloodhound.tokenizers.whitespace, 
     sufficient: 3, 
     local: this.suggestions 
}); 

$('#tagsInput .typeahead').typeahead({ 
     hint: true, 
     highlight: true, 
     minLength: 1 
    }, { 
     name: 'suggestions', 
     displayKey: 'value', 
     source: bloodhoundSuggestions 
    });

的方法。

请务必添加下列app.component.ts

import * as $ from 'jquery';

，并确保导入以下你的组件文件。

declare const Bloodhound; 
declare const $;

组件的HTML文件

<div id="tagsInput"> 
    <input class="typeahead" type="text" placeholder="States of USA"> 
</div>

来源

2017-11-01 04:43:41

将Bloodhound导入Angular 2 CLI项目

回答

相关问题