关于angular:angular项目中使用introjs

3次阅读

共计 720 个字符,预计需要花费 2 分钟才能阅读完成。

angular8 的时候,须要装置 4.3.0 版本,而且须要装置 @types/intro.js;

angular9 则不须要装置特定版本,间接 5.1.0 就行,且不须要装置解释器。

还要在 angular.json 文件中进行配置, 引入对应的 css 文件

如果不采纳本地的 angular.json 文件的话,则须要本人新建一个款式文件,外面放用到的款式,记得用款式穿透属性,能力全局失效。

在打包的的时候可能会报 cannot call a namespace ('intro.js') 的谬误,解决办法为:
批改引入形式为:

import * as introJs_ from 'intro.js'

introJs = introJs_.default();

如果在 angular8 的版本里,须要批改 tsconfig.json 文件
退出如下两行代码

    "allowSyntheticDefaultImports":true,
    "esModuleInterop":true

如果是 angular9 的环境,则不须要上述步骤

失常跑起来的话,依照官网的文档进行开发就行啦,须要留神的是,如果想要在步骤框中引入事件,必须这样

import * as _introJs from "intro.js";

introJs = _introJs.default();

this.introJs.setOptions({
    ...,
    setps:[
        {
            title:"测试",
            element:element,
            intro:`<a onclick="test('123')"></a>`
        }
    ]
}).start();

function test(params){console.log(params)
}
window['test']=test;

须要挂载到全局事件上才行;

正文完
 0