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

发布时间：2020-12-17 10:34:07 所属栏目：安全来源：网络整理

导读：我想用ng-repeat将项目附加到同一行,但它似乎在新行上添加了项目.在下面的示例中,我希望它们位于同一行,如： “约翰25岁.杰西30岁.约翰娜28岁.” 结果是： 25岁的约翰. 杰西30岁. 约翰娜,28岁. 我怎么能做到这一点？ div ng-init="friends = [ {name:'John',

我想用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

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!