angularjs – 如何使用ng-repeat将项目附加到同一行或行

前端之家收集整理的这篇文章主要介绍了angularjs – 如何使用ng-repeat将项目附加到同一行或行前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我想用ng-repeat将项目附加到同一行,但它似乎在新行上添加了项目.在下面的示例中,我希望它们位于同一行,如:

“约翰25岁.杰西30岁.约翰娜28岁.”

结果是:

25岁的约翰.
杰西30岁.
约翰娜,28岁.

我怎么能做到这一点?

<div ng-init="friends = [
  {name:'John',age:25,gender:'boy'},{name:'Jessie',age:30,gender:'girl'},{name:'Johanna',age:28,gender:'girl'}
]">


<div ng-repeat="friend in friends">
    {{friend.name}} who is {{friend.age}} years old.
</div>

试试这个
<div ng-repeat="friend in friends" style="float:left">
   {{friend.name}} who is {{friend.age}} years old.
</div>

要么

<span ng-repeat="friend in friends">
    {{friend.name}} who is {{friend.age}} years old.
</span>

默认情况下,DIV呈现为display:block和SPAN as display:inline

原文链接:/angularjs/140264.html

猜你在找的Angularjs相关文章