angular—— 当ng-src图片路径为空 设置默认图片
<!-- Created by nannan on 16/3/14. --> <ion-view hide-tabs="true" id="page-find-topic-or-activity-list" view-title={{inParams.pageTitle}}> <ion-content> <section> <div class="topic_list" ng-repeat="item in data.items" ng-click="action.toPage(inParams.pageTitle,'tab.home-recommend-topic-detail')"> <img ng-src="{{item.img}}" src="" err-src="img/sample/home_cover.png" alt="活动" class="full-image"/> <p ng-if="inParams.pageTitle == '话题精选'" class="flex_box topc_info"> <span class="list_item topc_title">{{item.title}}</span> <i class="list_sub_item topc_date">{{item.time}}</i> </p> </div> </section> </ion-content> </ion-view>
重点:得预留src的位置。(http://www.cnblogs.com/GoodPingGe/p/4529265.html)
<img ng-src="{{item.img}}" src="" err-src="img/sample/home_cover.png" alt="活动" class="full-image"/>
/** * Created by nannan on 16/3/13. */ angular.module('MrTrustApp.directives') //TODO 隐藏tabs .directive('errSrc', function($rootScope) { return { restrict: 'A', link: function(scope, element, attrs) { element.bind('error', function() { console.log(9); if (attrs.src != attrs.errSrc) { attrs.$set('src', attrs.errSrc); } }); } }; }) ;
方法二:不需要js
<!-- Created by nannan on 16/3/14. --> <ion-view hide-tabs="true" id="page-find-topic-or-activity-list" view-title={{inParams.pageTitle}}> <ion-content> <section> <div class="topic_list" ng-repeat="item in data.items" ng-click="action.toPage(inParams.pageTitle,'tab.home-recommend-topic-detail')"> <img ng-src="{{item.img}}" src="" onerror="this.src='img/sample/home_cover.png'" alt="活动" class="full-image"/> <p ng-if="inParams.pageTitle == '话题精选'" class="flex_box topc_info"> <span class="list_item topc_title">{{item.title}}</span> <i class="list_sub_item topc_date">{{item.time}}</i> </p> </div> </section> </ion-content> </ion-view>
<img ng-src="{{item.img}}" src="" onerror="this.src='img/sample/home_cover.png'" alt="活动" class="full-image"/>