2

我是 angular 新手,从 generator-angular 开始了一个简单的项目。

一定有一些东西不能与 usemin 和 $http 请求从 json 注入 url。

我能够让 yeoman.png 与缓存破坏一起使用,但由于某种原因,将图像 url 从 $http 请求加载到本地 json 似乎不起作用。

我通过将 '{{project.mainImg}}' 替换为 yeoman.png '{{image}}' 来测试 ng-repeat,并且效果很好。

这只是在运行 grunt build 并创建缓存清除后出现的问题。

gruntfile.js:

usemin: {
  html: ['<%= yeoman.dist %>/{,*/}*.html'],
  css: ['<%= yeoman.dist %>/styles/{,*/}*.css'],
  js: '<%= yeoman.dist %>/scripts/*.js',
  options: {
    assetsDirs: ['<%= yeoman.dist %>', '<%= yeoman.dist %>/images'],
    patterns: {
      js: [
        [/(images\/.*?\.(?:gif|jpeg|jpg|png|webp|svg))/gm, 'Update the JS to reference our revved images']
      ]
    }
  }
},

控制器:

angular.module('testProjectApp')
 .controller('MainCtrl', function ($scope, $http) {
   $http.get('projects/projects.json').success(function(data) {
   $scope.projects = data;
 });
 $scope.image = "images/yeoman.png";
});

html:

<img ng-src="{{image}}" alt="I'm Yeoman"><br>

<div class="project" ng-repeat="project in projects">
  <a href="{{project.url}}" target="_blank" class="{{project.title}}">
    <strong>{{project.title}}</strong>
    <img ng-src="{{project.mainImg}}" width="100%" />
  </a>
</div>
4

0 回答 0