Question

我正在尝试使用Plunkr对我在生产应用中使用md-choices的一些问题进行一些实验。当我创建plunkr时，md-select看起来与应用程序中的外观完全不同。我做错了什么？

<head>

    <!-- Angular Material CSS now available via Google CDN; version 0.9.4 used here -->
    <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/angular_material/1.1.0-rc2/angular-material.min.css">

  </head>
  <body ng-app=YourApp>

    <!-- Angular Material Dependencies -->
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-animate.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-aria.min.js"></script>

    <!-- Angular Material Javascript now available via Google CDN; version 0.9.4 used here -->
    <script src="http://ajax.googleapis.com/ajax/libs/angular_material/1.1.0-rc2/angular-material.min.js"></script>

  <script>

        // Include app dependency on ngMaterial

        angular.module( 'YourApp', ['ngMaterial'] )
            .controller("YourController", function($scope){
              $scope.options = ['1', '2', '3'];
            } );

    </script>


    <div ng-controller="YourController">
      <md-input-container>
        <md-select>
          <md-option ng-repeat="option in options">
            {{option}}
          </md-option>
        </md-select>
      </md-input-container>

    </div>

  </body>

Answer 1

md-select需要ng模型。您将在控制台中注意到$ compile：ctreq，表示缺少必需的控制器。一旦我添加了它，错误消失了，但下拉列表中的选项是空白的。我在md-option元素中添加了{{option}}，一切都很开心。

这是一个有效的例子

＆＃13;

<!DOCTYPE html>
<html>
  <head>

    <!-- Angular Material CSS now available via Google CDN; version 0.9.4 used here -->
    <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/angular_material/1.1.0-rc2/angular-material.min.css">

  </head>
  <body ng-app=YourApp>

    <!-- Angular Material Dependencies -->
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-animate.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-aria.min.js"></script>

    <!-- Angular Material Javascript now available via Google CDN; version 0.9.4 used here -->
    <script src="http://ajax.googleapis.com/ajax/libs/angular_material/1.1.0-rc2/angular-material.min.js"></script>

  <script>

        // Include app dependency on ngMaterial

        angular.module( 'YourApp', ['ngMaterial'] )
            .controller("YourController", function($scope){
              $scope.options = ['1', '2', '3'];
            } );

    </script>


    <div ng-controller="YourController">
      <md-input-container>
        <md-select ng-model="myModel">
          <md-option ng-repeat="option in options">
            {{option}}
          </md-option>
        </md-select>
      </md-input-container>

    </div>

  </body>

</html>

＆＃13;

为什么没有选择在我的Plunkr工作？

1 个答案: