pf-src not populating data-src

[sk5]

Hello, I have encountered an issue that I haven't been able to pin down after a day of trying to troubleshoot it on my own. I have a few places in my angular app where I am trying to implement your picturefill add on. I have two partials where I am trying to get everything working. The first partial is populated at the root of the site and I am referencing the images from JSON successfully. The second instance is also a partial but a new JSON item is being called to populate it based on the templateURL. The image URL's populate just fine within the picture-fill pf-src but they do not populate the data-src, which in turn results in the img's being blank as well. Everything else works perfectly as intended, the data-src is just isn't populating.

Here are a few bits of code to give you a better picture of the structure

$routeProvider.
      when('/', {
          templateUrl: 'Partials/home-posts.html',
          controller: 'PostListCtrl'
      }).
      when('/post/:postUrl', {
        templateUrl: 'Partials/post.html',
        controller: 'PostDetailsCtrl'
      });

This is the controller for the working picture-fill

postController.controller('PostListCtrl', function($scope, Post) {
    $scope.posts = Post.query();
});

This is the controller for the failing picture-fill

postController.controller('PostDetailsCtrl', function($scope, $routeParams, Post) {
    $scope.post = Post.get({postUrl: $routeParams.postUrl});
});

Any help would be appreciated! Thanks.

[tinacious]

Hi @sk5, I can take a look at your code for you if you could share it. Can you provide a CodePen or Plunkr of the code that isn't working? It would also be helpful to see the code for the view and Post service.

[sk5]

Thanks for getting back to me. I went ahead and added a project to my git so you can see the entire base of the project -- https://github.com/sk5/picturefill-dev. That has the two pages that work and don't work. The partials are home-posts.html (working) and post.html (not working). I believe what needs to happen for post.html to work is either a $timeout or $apply after JSON is loaded for the partial?

I started making this all on plunkr but the scenario would take some time to get working on that kind of tool. I am a bit on the newbie side of Angular so if things are done incorrectly, I apologize. I appreciate the help!

[mhdSid]

I encountered the same scenario. In some places the appended image has a src and in other places the img exists in the tree but has no src. I think in your code there is something like "$timeout(picturefill)".

[mhdSid]

Skaters have the same problems and issues....