Javascript 停止角度/css中图像的自动旋转

我不知道这是不是仅仅是角度造成的，还是css在自动旋转

在windows资源管理器中查看以下图像：

所有这些图像都是正确的

现在，当我在浏览器中显示它们时：

你可以清楚地看到问题所在。最初处于纵向模式的所有图像将自动旋转。为什么会发生这种情况，可能的解决方案是什么

这是我的密码：

gallery.component.ts

import { Component, Input } from '@angular/core';

@Component({
  selector: 'app-gallery',
  templateUrl: './gallery.component.html',
  styleUrls: ['./gallery.component.css']
})
export class GalleryComponent {
    @Input() datasource;
    selectedImage;

    setSelectedImage(image) {
        this.selectedImage = image;
    }
}

gallery.component.html：

<div class="modal fade" id="selectedImageModal" >
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-body">
                <img *ngIf="selectedImage" src="{{selectedImage.url}}" >
            </div>
        </div>
    </div>
</div>
<ul id="thumbnailsList">
    <li *ngFor="let image of datasource" >
        <img src="{{image.url}}" class="tn"
             width="191" height="146"  
             data-toggle="modal" data-target="#selectedImageModal"
             (click)=setSelectedImage(image) />
    </li>
</ul>

然后，我将按如下方式使用此库组件：

<div class="col-md-8 col-md-offset-1">
    <app-gallery [datasource]="images"></app-gallery>
</div>

---

有没有办法停止此自动旋转？

JPEG图像文件包含描述照片原始方向的元数据。这就是Windows用来旋转图像的方式，但浏览器还不支持这种方式

请参阅以下答案，了解一些备选方案：

<div class="col-md-8 col-md-offset-1">
    <app-gallery [datasource]="images"></app-gallery>
</div>

import { Component } from '@angular/core';

@Component({
  selector: 'app-home',
  templateUrl: './home.component.html',
  styleUrls: ['./home.component.css']
})
export class HomeComponent {

    images;

   constructor(){
      this.images = [
            {"url":"assets/Images/1.jpg"},
            {"url":"assets/Images/2.jpg"},
            {"url":"assets/Images/3.jpg"},
            {"url":"assets/Images/4.jpg"},
            {"url":"assets/Images/5.jpg"},
            {"url":"assets/Images/6.jpg"},
            {"url":"assets/Images/7.jpg"},
            {"url":"assets/Images/8.jpg"},
            {"url":"assets/Images/9.jpg"},
            {"url":"assets/Images/10.jpg"},
            {"url":"assets/Images/11.jpg"},
            {"url":"assets/Images/12.jpg"},
            {"url":"assets/Images/13.jpg"},
            {"url":"assets/Images/14.jpg"},
            {"url":"assets/Images/15.jpg"},
            {"url":"assets/Images/16.jpg"}
      ];
   }

}