获取lightbox 2在Angular 2中工作？

Question

我无法让Lightbox 2在Angular 2中工作.我按照文档中的描述进行设置,但我总是得到错误"Uncaught TypeError:this.$ lightbox.css(...).fadeIn不是函数".我找不到任何示例代码来实现这一点.

Answer 1

如果您使用的是Angular CLI,请像导入任何其他外部/ jQuery库一样.

所以:

1. npm install --save lightbox2

2. 为angular-cli.json添加样式:

   "styles": [ "styles.css", "../node_modules/lightbox2/dist/css/lightbox.min.css" ],

3. 将脚本添加到angular-cli.json

   "scripts": [ "../node_modules/jquery/dist/jquery.js", "../node_modules/lightbox2/dist/js/lightbox.min.js" ],

4. 将图像添加到模板中,例如(使用语义ui)

   <a href="/assets/img/flag.png" data-lightbox="image" data-title="My caption"> <img class="ui bordered small image" src="/assets/img/flag.png"> </a>