Html引导表未出现在屏幕上答案

【问题标题】：Html bootstrap table not appearing on screenHtml引导表未出现在屏幕上
【发布时间】：2016-04-08 17:27:52
【问题描述】：

我无法在 html 中显示表格。当我对表中的值进行硬编码时，它们会出现，但在使用 angularjs 时它们不会出现。所以我认为这个问题与angualrjs中的某些东西有关。这是我要显示的 html 代码：

 <div class="container">
 <h2>Hover Rows</h2>
 <p>The .table-hover class enables a hover state on table rows:</p>            
 <table class="table table-hover">
 <thead>
  <tr>
    <th>Friends</th>
  </tr>
 </thead>
 <tbody>
    <tr ng-repeat="Friends in AllUsersFriends">
        <td>{{Friends}}</td>
  </tr>
 </tbody>
 </table>
 </div>

这是我的 controller.js 代码：

    socket.on("AllFriends",function (Friends){
  $log.log('so the friends are');
  $scope.AllUsersFriends=Friends;
  console.log($scope.AllUsersFriends);
  $scope.$apply();
});

我通过 flask-socketio 接收一个数组，然后将该数组设置为我创建的 $scope.AllUsersFriends 数组。我在控制台中看到了数据，但屏幕上没有出现任何行。如何让我的数据出现在屏幕上？谢谢。

【问题讨论】：

在您的 console.log 中您是否传递了任何 HTML？也许有错误的标记导致行或过早结束，这可能导致表格不出现，或者可能是某个类将表格设置为 display:none。只是一个想法

标签： javascript html angularjs twitter-bootstrap bootstrap-table

【解决方案1】：

所以我解决了我的问题，问题是数组中的数据实际上正在更新，但我的应用程序中有不同的页面，一旦我更改页面，数据就会丢失，然后我通过创建相同的数组来解决它在服务中，以便更改是全局的，并且不会从阵列中擦除数据。所以表格总是显示它只是没有任何数据要显示。非常感谢

【讨论】：

【解决方案2】：

看看这个：

<html>
<head>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha/css/bootstrap.min.css"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.8/angular.min.js"></script>
</head>
<body ng-app="myApp" ng-controller="myCtrl">

 <table class="table table-hover">
    <tr><th>Friends</th></tr>
    <tr ng-repeat="x in friends"><td>{{x.name}}</td></tr>
 </table>

<script>
//App declaration
var app = angular.module('myApp',[]);
//Controller Declaration
app.controller('myCtrl',function($scope){
    $scope.friends = [{name: "Peter"},{name:"Laila"},{name:"Rosy"}];

});

</script>
</body> 
</html>

希望，它解决了！

【讨论】：