Javascript 带有复选框和ng重复的表格（角度JS）_Javascript_Angularjs_Html Table_Material Design

Javascript 带有复选框和ng重复的表格（角度JS）

javascript angularjs

Javascript 带有复选框和ng重复的表格（角度JS）,javascript,angularjs,html-table,material-design,Javascript,Angularjs,Html Table,Material Design,我想基于此模型制作一张表（Material Design Lite）：在我的代码中，我有一个列表，我尝试使用ng repeat以以下方式显示它： <table class="mdl-data-table mdl-js-data-table mdl-data-table--selectable mdl-shadow--2dp"> <thead>

我想基于此模型制作一张表（Material Design Lite）：

在我的代码中，我有一个列表，我尝试使用ng repeat以以下方式显示它：

                    <table class="mdl-data-table mdl-js-data-table mdl-data-table--selectable mdl-shadow--2dp">
                      <thead>
                        <tr>
                          <th class="mdl-data-table__cell--non-numeric">Id. administrateurs</th>
                        </tr>
                      </thead>
                      <tbody>
                        <tr ng-repeat="admin in listAdmins">
                            <td class="mdl-data-table__cell--non-numeric" ng-model="adminselected">{{admin}}</td>
                        </tr>
                      </tbody>
                    </table>


Id.管理员
{{admin}}

但结果与图示示例不同：

正如我们所看到的，左边没有复选框，我不明白为什么

还有，如何制作一个表格，我们可以直接在上面添加数据

事实上，有了一个固定的列表，它就可以工作了。但我的是由数据库中的请求生成的，其值可以更改。“我的listadmin”在开始时为空，它由身份验证过程完成。

您的代码工作正常

<html ng-app="myApp">
  <head>
    <!-- Material Design Lite -->
    <script src="https://code.getmdl.io/1.3.0/material.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.1/angular.js"></script>

    <link rel="stylesheet" href="https://code.getmdl.io/1.3.0/material.indigo-pink.min.css">
    <!-- Material Design icon font -->
    <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
    <script>
      angular.module('myApp', []).controller('MainController', ['$scope', function($scope){
        $scope.listAdmins = ['admin1', 'admin2', 'admin3'];
      }]);
    </script>
  </head>
  <body ng-controller="MainController as main">
       <table class="mdl-data-table mdl-js-data-table mdl-data-table--selectable mdl-shadow--2dp">
                      <thead>
                        <tr>
                          <th class="mdl-data-table__cell--non-numeric">Id. administrateurs</th>
                        </tr>
                      </thead>
                      <tbody>
                        <tr ng-repeat="admin in listAdmins">
                            <td class="mdl-data-table__cell--non-numeric" ng-model="adminselected">{{admin}}</td>
                        </tr>

                      </tbody>
                    </table>     
  </body>
</html>


角度.module（'myApp'，[]）.controller（'MainController'，['$scope'，function（$scope）{
$scope.listAdmins=['admin1'，'admin2'，'admin3']；
}]);
Id.管理员
{{admin}}

可能发生了一些错误？你能看到浏览器控制台吗。

当我在模型中执行示例时，它可以工作，但使用ng repeat时，它不工作。在我的控制台中没有问题。在编译完文件后获得了什么html？可能是因为html有一些损坏的标记？我在这个主题上发布的屏幕。编译节点/角度后获得。事实上，如果我删除ng repeat，就没有问题了。但事实是，我需要它来打印我的数据，并对其进行操作！我看到的截图。我在页面上谈到了html标记（例如，开发人员控制台Chrome浏览器中的“元素”选项卡）。可能是标记编译不正确。您可以使用angular[ui grid.info]