Question

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

"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>

但这不起作用。

Answer 1

对于您的问题，这是一个很好的方法，ng-if您只需添加/删除有条件的元素即可。另请注意ng-src，这是将网址注入src元素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",
        }]
    };
});

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

1 个答案: