将血犬导入角2 CLI项目

Question

我正在尝试将Bloodhound.js实现到一个使用角2cli的角2项目中。目前，我让jQuery通过以下方法工作：

1. npm安装jquery --保存
2. npm安装@type/jquery--保存-dev
3. 然后在角-cli.json中的脚本数组中添加“./node_modules/jquery/dist/jquery.min.js”。

我在ange-cli.json中对Bloodhound.js也做了同样的操作，如下所示：

"../node_modules/bloodhound-js/dist/bloodhound.min.js“

但是，我得到了以下错误：

找不到名字“血犬”。

是否有直接导入.js文件或在本地添加导入的方法？

Answer 1

这是我的解决办法。希望有人能帮上忙。

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

npm install --save @types/typeahead

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

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

在组件的OnInit()方法中执行以下操作

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
  });

我也安装了jQuery。

请确保在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>