如何在条件语句中显示 img 标签？答案

【问题标题】：How to display img tag in conditional statement?如何在条件语句中显示 img 标签？
【发布时间】：2015-09-30 16:08:35
【问题描述】：

嗨，我有一个项目列表，我需要显示我正在使用离子列表列出，所以在我的列表项目中它包含图像或视频 json

"media": [{"type": "img","src": "http://images/2015/May/161887.jpg"},{"type": "video","src": "http:/video/2015/May/161887.mp4",}]

html 代码。

<div class="news_image" ng-repeat="image in item.media">
  {{ image.type=='video'? 'video':image.type=='<img src="{{ image.src}}'? 'image': 'default' }}
</div>

但这不起作用。

【问题讨论】：

标签： html angularjs cordova ionic

【解决方案1】：

这是解决问题的好方法，使用ng-if，您可以有条件地简单地添加/删除您需要的元素。看看ng-srctoo，这也是将 URL 注入 srcelements 的好方法，例如 img：

NgIf doc

JSFiddle

HTML：

<div ng-app="myApp" ng-controller="myCtrl">
    <div class="news_image" ng-repeat="image in items.media">
        <img ng-src="{{image.src}}" ng-if="image.type === 'img'" />
        <video ng-if="image.type === 'video'" width="320" height="240" controls>
          <source ng-src="{{image.src}}" type="video/mp4">
        </video>
    </div>
</div>

JS：

angular.module('myApp', [])
    .controller('myCtrl', function ($scope) {
    $scope.items = {
        "media": [{
            "type": "img",
            "src": "http://images/2015/May/161887.jpg"
        }, {
            "type": "video",
            "src": "http:/video/2015/May/161887.mp4",
        }]
    };
});

【讨论】：

添加简短说明或指出 ngIf 的使用可能对 OP 有所帮助。
您好，图像工作正常，但视频无法正常工作。