Question

我会使用Typedjs

以角度2制作打字机效果

如site页所示，我已经使用npm：

安装了软件包

npm install typed.js

然后我将此代码添加到我的组件中：

import Typed from 'typed.js';// not sure if it's the right way

和

ngOnInit() {


    var typed = new Typed(".element", {
        strings: ["This is a JavaScript library", "This is an ES6 module"],
        smartBackspace: true // Default value
    });
}

然后在我的html文件中：

<div id="typed-strings">
    <p>Typed.js is an <strong>Awesome</strong> library.</p>
    <p>It <em>types</em> out sentences.</p>
</div>
<span id="typed"></span>

我收到此错误：

/home/haddad/projects/siteperso/src/app/slide-presentation/slide-presentation.component.ts (18,21): Cannot find name 'Typed'.

PS：我对任何与Typed.js做同样工作并与Angular 2/4合作的其他命题持开放态度

Answer 1

您需要将导入更改为import * as Typed from 'typed.js';

Answer 2

在您的项目中安装typed.js软件包

npm install typed.js --save

在您的component.ts文件中导入typed.js

import Typed from 'typed.js';

将此代码添加到component.ts的ngOnInit（）

const options = {
     strings: ['Innovation.', 'Discovery.'],
     typeSpeed: 100,
     backSpeed: 100,
     showCursor: true,
     cursorChar: '|',
     loop: true
};

const typed = new Typed('.typed-element', options);

创建html元素以呈现typed.js的输出

<span class="typed-element">Fsfsfsfsfs</span>

请参阅https://github.com/vishalhulawale/angular/tree/master/integrations/typedJS

Answer 3

尝试从import模块更改Typed以导入typed.js，如下所示：

import { Typed } from 'typed.js';

Answer 4

您可以使用 NPM 中的一个包。而且很简单

包裹网址和文件
https://www.npmjs.com/package/ngx-typed-js

命令

npm install --save ngx-typed-js

Answer 5

要说"new Typed"，您需要一个构造函数，为此，您需要像这样导入库：

import Typed from 'typed.js/src/typed.js';

如何将Typed.js与Angular 2集成？

5 个答案: