我正在Anugular 1.5上开发SPA。我在IE11上遇到了非常糟糕的错误。它不会渲染我的照片,而是在黑盒子里得到白色X.什么是最有趣的,浏览器根据要求获得200代码响应img。 附上带有问题的HTML代码和屏幕
function NewsController($rootScope, $scope, $rest, $translate, $sideFilterMenuItems, $languages, $utils) {
var $ctrl = this;
$ctrl.sideFilterMenuItems = $sideFilterMenuItems;
$ctrl.languages = $languages;
$ctrl.news = [];
$ctrl.tags = [];
$ctrl.tagsSearchString = undefined;
$ctrl.validDatePicker = true;
$ctrl.readNews = false;
$ctrl.unreadNews = false;
$ctrl.newsLoading = false;
$ctrl.noResults = false;
$ctrl.error = undefined;
$ctrl.filters = {
pageNumber: 1,
searchStrings: undefined,
filterType: undefined,
language: undefined,
dateFrom: undefined,
dateTo: undefined,
read: undefined
};
getNews();
$ctrl.getNews = getNews;
$scope.$on('event.common.bottomReached', function () {
getNews();
});
$ctrl.getNewsTags = function (searchString) {
if (searchString.length >= 3) {
$rootScope.silent = true;
return $rest.getNewsTags({
searchString: searchString
}).$promise.then(function (response) {
if (!_.isEmpty(response.tags)) {
_.each(response.tags, function (tag) {
tag.translation = $translate;
$translate('news.' + tag.text).then(function (translation) {
tag.translation = translation;
});
});
return response.tags;
}
return [];
}, angular.noop);
}
};
$ctrl.fillInTags = function (tag) {
if (!_.includes(_.map($ctrl.tags, 'code'), tag.code)) {
$ctrl.tags.push(tag);
}
$ctrl.tagsSearchString = undefined;
$scope.$digest();
};
$ctrl.resetFilters = function () {
$ctrl.tags = [];
$ctrl.tagsSearchString = undefined;
_.each($ctrl.filters, function (fval, fkey) {
switch (fkey) {
case 'filterType':
break;
case 'pageNumber':
$ctrl.filters.pageNumber = 1;
break;
default:
$ctrl.filters[fkey] = undefined;
break;
}
});
_.each($languages, function (language) {
language.active = false;
});
$languages[0].active = true;
$ctrl.news = [];
$ctrl.readNews = false;
$ctrl.unreadNews = false;
getNews();
};
$ctrl.getLongDescription = function (item) {
var longDescriptionContainer = $('#' + item.newsId + '_LongDescription');
longDescriptionContainer.html($ctrl.getPartContent(item.content));
};
$ctrl.getPartContent = function (part) {
var currentLang = $translate.use();
if (_.isEmpty(part[currentLang])) {
switch (currentLang) {
case 'en':
return part.ru;
case 'ru':
return part.en;
default:
return '';
}
} else {
return part[currentLang];
}
};
function getNews(force) {
$ctrl.newsLoading = true;
$ctrl.noResults = false;
$ctrl.error = undefined;
$ctrl.filters.dateFrom = $utils.isValidDate($ctrl.filters.dateFrom) ? moment($ctrl.filters.dateFrom).format('YYYY-MM-DD') : undefined;
$ctrl.filters.dateTo = $utils.isValidDate($ctrl.filters.dateTo) ? moment($ctrl.filters.dateTo).format('YYYY-MM-DD') : undefined;
$ctrl.filters.read = (($ctrl.readNews && $ctrl.unreadNews) || (!$ctrl.readNews && !$ctrl.unreadNews)) ? undefined : $ctrl.readNews;
var searchStrings = _.map($ctrl.tags, 'synonymString');
if (!_.isEmpty($ctrl.tagsSearchString)) searchStrings.push($ctrl.tagsSearchString);
$ctrl.filters.searchStrings = _.join(searchStrings, ',') || undefined;
if (force) {
$ctrl.news = [];
$ctrl.filters.pageNumber = 1;
}
$rest.getNews($ctrl.filters).$promise.then(
function (data) {
if (!_.isEmpty(data.items)) {
$ctrl.news = _.concat($ctrl.news, data.items);
$ctrl.filters.pageNumber++;
}
$ctrl.noResults = _.isEmpty($ctrl.news);
$ctrl.newsLoading = false;
},
function (response) {
$ctrl.error = response.data.code || 'error.unknownError';
}
);
}
}
<div class="item" ng-class="{read: item.read}" ng-repeat="item in $ctrl.news">
<div class="header-row unselectable">
<div class="date">{{ item.publicationDate | date: 'shortDate' }}</div>
<div class="type">{{ 'news.' + item.group.text | translate }}</div>
<div class="favorite" ng-click="$ctrl.markNewsAsFavorite(item)">
<i ng-if="item.favorite" class="fa fa-star selected"></i>
<i ng-if="!item.favorite" class="fa fa-star-o"></i>
</div>
</div>
<div class="topic-row">{{ $ctrl.getPartContent(item.topic) }}</div>
<div class="tags-row unselectable" ng-if="item.tags.length > 0">
<div class="newstag" ng-repeat="tag in item.tags">{{ 'news.' + tag.text | translate }}</div>
</div>
<div class="content-row row">
<div class="col-xs-3 col-md-3 image unselectable" ng-if="item.imageId">
<img ng-src="/portal/api/private/image?imageId={{ item.imageId }}">
</div>
<div id="{{ item.newsId }}_ShortDescription" ng-if="!item.expanded" class="description">
{{ $ctrl.getPartContent(item.description) }}
</div>
<div id="{{ item.newsId }}_LongDescription" ng-if="item.expanded" class="description">
{{ $ctrl.getLongDescription(item) }}
</div>
<div class="read-more link unselectable">
<span ng-click="$ctrl.markNewsAsRead(item)">
{{ item.expanded ? 'news.read_less' : 'news.read_more' | translate }}
</span>
</div>
</div>
</div>
答案 0 :(得分:0)
你试过
吗?<img src="/portal/api/private/image?imageId={{ item.imageId }}">