Hello,
When I click on the ion-item, the animation to the next page is not trigered, here is my code :
<ion-list>
<ion-item ng-repeat="com in coms" class="item-thumbnail-right" nav-direction="forward" href="#/dash/{{com.id}}">
<img class="item-image" ng-src="data:image/jpeg;base64,{{com.img1}}">
<div class="item-category">{{com.category}}</div>
<div class="item-title">{{com.title}}</div>
<div class="com-item-bottom">
<div class="com-comment positive">{{com.commentcount}}</div>
</div>
</ion-item>
</ion-list>
Can you help me ?
Don’t forget to add nav-transition=“android” attribute.
Google it if you want to find out more.
Still having the issue, what is strange is when I am doing like this the event is triggered :
<ion-list>
<ion-item ng-repeat="com in coms" class="item-thumbnail-right">
<a class="item-href" nav-direction="forward" href="#/dash/{{com.id}}">
<img class="item-image" ng-src="data:image/jpeg;base64,{{com.img1}}">
<div class="item-category">{{com.category}}</div>
<div class="item-title">{{com.title}}</div>
<div class="com-item-bottom">
<div class="com-comment positive">{{com.commentcount}}</div>
</div>
</a>
</ion-item>
</ion-list>
But I have to click on text or image to fire the href.
Yay! Got the same problem here! After a lot of research I saw that the navDirection had to be on the anchor tag to work so I tweaked the base ionItem directive to get it to work.
It seems to work great but tell me if you have any issue.
Here is the code I wrote :
(function (angular) {
angular.module('app')
.directive('ionItem', ionItem);
ionItem.$inject = ['$compile'];
function ionItem($compile) {
var directive = {
priority: 1,
restrict: 'E',
link: link
};
return directive;
function link($scope, $element, $attrs) {
if ($attrs.navDirection) {
var $ionContent = $element.find('.item-content');
$ionContent.attr('nav-direction', $attrs.navDirection);
$compile($ionContent)($scope);
}
}
}
})(angular);