That looks like jCarousel is throwing the error on that. You could try updating the included version of jCarousel (not my script) and see if that helps. I would start by turning off the carousel though just to confirm my suspicions.
On Tue Dec 02 2014 at 7:11:57 PM Chris Trude <[email protected]> wrote: > So I'm making headway, but now getting an error that I don't know what to > do with. Here's my updated code: > > > 'use strict'; > > angular.module('myApp') > .directive('pikachoose', function () { > return { > templateUrl: 'app/pikachoose/pikachoose.html', > restrict: 'EA', > link: function (scope, element) { > angular.element('#pika').pikachoose({ > showCaption: false, > transition: 6, > autoPlay: false, > carousel: true > }); > }, > controller: function($scope, $timeout){ > var setPhotos = function(){ > $scope.photos = $scope.listing.photos[0].photo; > } > > if (!$scope.listing){ > $timeout(setPhotos); > } > } > }; > }); > > > And the error: > > TypeError: Cannot read property 'left' of undefined > at Object.$.jCarousel.plugin.closest ( > http://localhost:9000/bower_components/jcarousel/dist/jquery.jcarousel.js:381:49 > ) > at Object.$.jCarousel.plugin._reload ( > http://localhost:9000/bower_components/jcarousel/dist/jquery.jcarousel.js:335:33 > ) > at Object.$.jCarousel.plugin._create ( > http://localhost:9000/bower_components/jcarousel/dist/jquery.jcarousel.js:289:18 > ) > at Object.create ( > http://localhost:9000/bower_components/jcarousel/dist/jquery.jcarousel.js:79:22 > ) > at Object.$.(anonymous function) ( > http://localhost:9000/bower_components/jcarousel/dist/jquery.jcarousel.js:175:18 > ) > at HTMLUListElement.<anonymous> ( > http://localhost:9000/bower_components/jcarousel/dist/jquery.jcarousel.js:219:25 > ) > at Function.jQuery.extend.each ( > http://localhost:9000/bower_components/jquery/dist/jquery.js:375:23) > at jQuery.fn.jQuery.each ( > http://localhost:9000/bower_components/jquery/dist/jquery.js:139:17) > at $.fn.(anonymous function) [as jcarousel] ( > http://localhost:9000/bower_components/jcarousel/dist/jquery.jcarousel.js:213:22 > ) > at Object.$pc.fn.extend.build ( > http://localhost:9000/bower_components/pikachoose-bower/lib/jquery.pikachoose.js:218:15) > <pikachoose> > > > > On Tuesday, December 2, 2014 6:43:26 PM UTC-5, Chris Trude wrote: >> >> Hey Jeremy, Funny seeing you here! A few things here, You are not really >> building the directive properly in my opinion Here's how I would do it, and >> after I write it here, I'm going to implement it in my code and see if it >> works so hold tight: >> >> *HTML:* >> >> <pikachoose photos="listing.photoArray" listing="listing"> </pikachoose> >> >> >> *Angular Directive:* >> >> myapp.directive('pikachoose', function(){ >> >> return{ >> >> restrict: 'EA', >> >> replace: true, >> >> scope: {photos: '=', listing: '='}, >> >> template: '<ul class="slideshow><li ng-repeat="image in photos" >> class="image"><img src="image"></li>', >> >> link: function(scope, element) { >> >> angular.element(element).pikachoose(); >> >> } >> >> } >> >> } >> >> >> I'll be testing this out shortly and will let you know if it works for >> me. I'm not sure what your object structure looks like, so this assumes >> that image is a url, if not thats easily fixed. Also i have no idea what >> you are doing with this: {{_i(image, listing.posted_date, 'l')}} or >> scope.$last, So I left those out for now. >> >> -Chris Trude >> >> On Tuesday, February 12, 2013 11:55:55 AM UTC-5, Jeremy Fry wrote: >>> >>> So I've been wracking my head with trying to get Angular to play nice >>> with a jQuery slideshow plugin. I have a working chunk of code now, but I >>> don't feel like it's the "angular" way to do it. If I remove the timeout >>> from my directive then I get the angular code fed into my plugin rather >>> than the actual source for the image. Not sure the proper way to do this, >>> but I'm interested in learning it. >>> >>> *The html:* >>> <ul class="slideshow"> >>> <li class="image" ng-repeat="image in listing.photoArray" pikachoose> >>> <img src="{{_i(image, listing.posted_date, 'l')}}"> >>> </li> >>> </ul> >>> >>> *Here's the directive:* >>> myapp.directive('pikachoose',function(){ >>> return { >>> compile: function (element, attrs){ >>> return function (scope, iElement, iAttrs, controller) { >>> if(scope.$last){ >>> console.log(iElement.find('img').attr('src')); //outputs >>> {{_i(image, listing.posted_date, 'l')}} not the actual source >>> setTimeout(function(){ >>> //plugin runs on the ul, not the li >>> iElement.parent().pikachoose(); >>> //without the timeout I get {{_i(image, listing.posted_date, >>> 'l')}} instead of the actual source >>> }, 0); >>> } >>> }; >>> } >>> }; >>> }); >>> >> -- > You received this message because you are subscribed to a topic in the > Google Groups "AngularJS" group. > To unsubscribe from this topic, visit > https://groups.google.com/d/topic/angular/LRTh1E21P5I/unsubscribe. > To unsubscribe from this group and all its topics, send an email to > [email protected]. > To post to this group, send email to [email protected]. > Visit this group at http://groups.google.com/group/angular. > For more options, visit https://groups.google.com/d/optout. > -- You received this message because you are subscribed to the Google Groups "AngularJS" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To post to this group, send email to [email protected]. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
