javascript 我应该如何使用带角度的灯箱
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/15082400/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How should i use lightbox with angular
提问by user192082107
I am using angular to shows the details of my Student Object
我正在使用 angular 来显示我的细节 Student Object
it is working fine
它工作正常
But also want the hyperlink on assignment text so that when someone click on that a lightbox opens with all the assignment object
details.
但也需要作业文本上的超链接,以便当有人点击它时,会打开一个包含所有assignment object
详细信息的灯箱。
Now my boss want to use angular only.
现在我的老板只想使用角度。
i know that i can use jquery modal dialog for that but how can i display lighbox in angularJs
我知道我可以为此使用 jquery 模态对话框,但是如何在 angularJs 中显示灯箱
回答by JJ Zabkar
You should be able to integrate this project:
您应该能够集成这个项目:
https://github.com/compact/angular-bootstrap-lightbox
https://github.com/compact/angular-bootstrap-lightbox
From the project's README, here's how it would be declared in your HTML:
在项目的 README 中,以下是它在 HTML 中的声明方式:
Gallery:
<ul ng-controller="GalleryCtrl"> <li ng-repeat="image in images"> <a ng-click="openLightboxModal($index)"> <img ng-src="{{image.thumbUrl}}" class="img-thumbnail" alt=""> </a> </li> </ul>
画廊:
<ul ng-controller="GalleryCtrl"> <li ng-repeat="image in images"> <a ng-click="openLightboxModal($index)"> <img ng-src="{{image.thumbUrl}}" class="img-thumbnail" alt=""> </a> </li> </ul>
Just like @Stewie's solution, the heavy lifting logic is handled by an Angular Directive.
就像@Stewie 的解决方案一样,繁重的逻辑由 Angular 指令处理。
回答by Stewie
Go learn about Angular directivesand take a look at how AngularUIor UI Bootstraputilizes directives to proxy the invocations to jQuery plugins.
去了解Angular 指令并看看AngularUI或UI Bootstrap如何利用指令将调用代理到 jQuery 插件。