Question

我刚刚开始使用Angularjs并且对bower有一个简单的问题，现在还没有解决它。

我被要求在我的项目中实施“blueimp-gallery”，我从bower下载它（bower install --s blueimp-gallery），这更新了我的 bower.json 并添加了“< strong> blueimp-gallery“：”〜2.18.2“依赖。

在index.html中请求了库需要的CSS和JS。还在视图和控制器中实现了所需的js和html。

看起来当我运行它并进入我已经实现了库的视图时，没有加载CSS和库需要的JS。

view.controller.js

$(function () {
      'use strict'
      $.ajax({
        url: 'https://api.flickr.com/services/rest/',
        data: {
          format: 'json',
          method: 'flickr.interestingness.getList',
          api_key: '7617adae70159d09ba78cfec73c13be3'
        },
        dataType: 'jsonp',
        jsonp: 'jsoncallback'
      }).done(function (result) {
        var carouselLinks = []
        var linksContainer = $('#links')
        var baseUrl
        $.each(result.photos.photo, function (index, photo) {
          baseUrl = 'https://farm' + photo.farm + '.static.flickr.com/' +
          photo.server + '/' + photo.id + '_' + photo.secret
          $('<a/>')
            .append($('<img>').prop('src', baseUrl + '_s.jpg'))
            .prop('href', baseUrl + '_b.jpg')
            .prop('title', photo.title)
            .attr('data-gallery', '')
            .attr('ng-click','handleClick($event)')
            .appendTo(linksContainer)
          carouselLinks.push({
            href: baseUrl + '_c.jpg',
            title: photo.title
          })
        })
      })
    })

index.html
<link rel="stylesheet" href="bower_components/blueimp-gallery/css/blueimp-gallery.css">
<link rel="stylesheet" href="bower_components/blueimp-gallery/css/blueimp-gallery-indicator.css">
<link rel="stylesheet" href="bower_components/blueimp-gallery/css/blueimp-gallery-video.css"> 
<script src="bower_components/blueimp-gallery/js/blueimp-helper.js"></script>
<script src="bower_components/blueimp-gallery/js/blueimp-gallery.js"></script>
<script src="bower_components/blueimp-gallery/js/jquery.blueimp-gallery.js"></script>


view.html
<h2>Lightbox image gallery</h2>
<div id="links" class="links"></div>
<div id="blueimp-gallery" class="blueimp-gallery">
<div class="slides"></div>
<h3 class="title"></h3>
<a class="prev">‹</a>
<a class="next">›</a>
<a class="close">×</a>
<a class="play-pause"></a>
<ol class="indicator"></ol>
</div>

也许我错过了什么，但不知道是什么。你能帮我解决这个问题吗？

如何在角度（blueimp）中正确安装bower组件？

0 个答案: