Angularjs 如何使用list标记和angular js打印项目数组，以便以三行三列的方式显示它们_Angularjs

Angularjs 如何使用list标记和angular js打印项目数组，以便以三行三列的方式显示它们

angularjs

Angularjs 如何使用list标记和angular js打印项目数组，以便以三行三列的方式显示它们,angularjs,Angularjs,我试着打印出一个名字列表，这样在页面上它们就会变成网格状。到目前为止我所拥有的 <html ng-app> <head> <script src="angular.js"></script></head> <body ng-init= "names=['Bob', 'Bill', 'Sarah', 'Robert', 'Sam', 'Jill', 'Dave', 'Larry', 'Jack']"> <ul ng-r

我试着打印出一个名字列表，这样在页面上它们就会变成网格状。到目前为止我所拥有的

<html ng-app>
<head> <script src="angular.js"></script></head>
<body ng-init= "names=['Bob', 'Bill', 'Sarah', 'Robert', 'Sam', 'Jill', 'Dave', 'Larry', 'Jack']">
<ul ng-repeat="firstname in names">
<li>{{firstname}}</li>
</ul>
</body>
</html>



{{firstname}}

它应该这样打印出来：鲍勃，比尔，莎拉罗伯特，山姆，吉尔

戴夫、拉里、杰克

将ng重复移动到李

<ul>
    <li ng-repeat="firstname in names">{{firstname}}</li>
</ul>

您会遇到什么错误？如果显示不正确，则必须使用css进行调整

ul {
    width: 100%;
    margin: 0;
    padding: 0;
}
ul li {
    display: inline-block;
    width: 33%;
    min-height: 100px;
    background: #ccc;
    border: solid 1px black;
    margin: -1px;
}