angularjs – 如何使用Colorbox与Angular JS

发布时间：2020-12-17 07:38:27 所属栏目：安全来源：网络整理

导读：如何使用Angular JS使用colorbox(fancybox或lightbox也是欢迎的),我应该写一个指令,它有其他的方法. 这是我的HTML： ...h2 class="box-header" i class="icon-hdd"/i div class="btn-group pull-right" a class="btn btn-mini" i class="icon-zoom-in"/i Exp

如何使用Angular JS使用colorbox(fancybox或lightbox也是欢迎的),我应该写一个指令,它有其他的方法.

这是我的HTML：

...
<h2 class="box-header">
    <i class="icon-hdd"></i>    
    <div class="btn-group pull-right">      
        <a class="btn btn-mini">
            <i class="icon-zoom-in"></i>
            Expand
        </a>
    </div>
</h2>   
<div id="open-with-colorbox">
...
</div>
...

用户将点击展开按钮,打开与colorbox id的div将打开为colorbox.

PS：我刚刚到Angular JS这就是为什么我正在寻找一个解决方案如何使用colorbox,我在我的应用程序使用twitter引导.

写一个指令,这是最好的选择.

指令示例：

app.directive('colorbox',function() {
  return {   
    restrict: 'AC',link: function (scope,element,attrs) {        
      $(element).colorbox(attrs.colorbox);     
    }
  };  
});

HTML：

<a colorbox="{transition:'fade'}" href="...">Image</a>

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!