Question

有没有办法让IE11正确显示Angular Material Dropdown（和所有其他浏览器一样）？

这就是它的样子：

这就是它在IE11中的外观：

这是网站： [例子不再可用。 AngularJS太慢了，我们用更快的技术代替它

这是此导航线的相关代码（简化）：

＆＃13;

angular.module('App', ['ngMaterial']);

＆＃13;

<!DOCTYPE html>
<html ng-app="App">

<head>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.11/angular.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.11/angular-animate.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.11/angular-aria.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.11/angular-messages.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/angular_material/1.1.4/angular-material.min.js"></script>
  <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/angular_material/1.1.4/angular-material.min.css">
</head>

<body>
  <div class="md-block" flex-gt-xs>
    <md-input-container layout="row">
      <div flex>
        <label>Mein Start-Ort (Adresse)</label>
        <inputclass="form-control" />
      </div>
      <div flex="nogrow">
        <md-button class="md-icon-button" aria-label="Standort">
          <md-icon md-svg-icon="_img/icons/location.svg"></md-icon>
        </md-button>
      </div>
    </md-input-container>
  </div>

  <div class="md-block" layout="row">
    <div flex="nogrow">
      <md-button class="md-raised md-primary">Schweiz</md-button>
    </div>
    <md-input-container flex>
      <label>Anreise</label>
      <md-select ng-model="transport">
        <md-option value="car" selected>Mit dem Auto</md-option>
        <md-option value="transit">Mit dem ÖV</md-option>
        <md-option value="bike">Mit dem Velo</md-option>
        <md-option value="walk">Zu Fuss</md-option>
      </md-select>
    </md-input-container>
  </div>
</body>

＆＃13;

Answer 1

我认为您不需要右侧元素的弹性值。这就像你追求的那样吗？

angular.module('App', ['ngMaterial']);

<!DOCTYPE html>
<html ng-app="App">

<head>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.11/angular.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.11/angular-animate.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.11/angular-aria.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.11/angular-messages.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/angular_material/1.1.4/angular-material.min.js"></script>
  <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/angular_material/1.1.4/angular-material.min.css">
</head>

<body>
  <div layout="row">
  <div class="md-block" flex-gt-xs>
    <md-input-container layout="row" flex>
      <div flex>
        <label>Mein Start-Ort (Adresse)</label>
        <input class="form-control" />
      </div>
      <div>
        <md-button class="md-icon-button" aria-label="Standort">
          <md-icon md-svg-icon="_img/icons/location.svg"></md-icon>
        </md-button>
      </div>
    </md-input-container>
  </div>

  <div class="md-block" layout="row">
    <div>
      <md-button class="md-raised md-primary">Schweiz</md-button>
    </div>
    <md-input-container>
      <label>Anreise</label>
      <md-select ng-model="transport">
        <md-option value="car" selected>Mit dem Auto</md-option>
        <md-option value="transit">Mit dem ÖV</md-option>
        <md-option value="bike">Mit dem Velo</md-option>
        <md-option value="walk">Zu Fuss</md-option>
      </md-select>
    </md-input-container>
  </div>
  </div>
</body>

IE11中角度材料下拉不正确显示

1 个答案: