Question

我有以下html：

<div id="div1"></div>
<div id="div2"></div>
<div id="div3"></div>
<div id="div4"></div>
<div id="div5"></div>
<div id="div6"></div>

输出显示为：

Div 1      Div 2
Div 3      Div 4
Div 5      Div 6

有关页面加载的一些信息，可能会隐藏Div 1或Div 2。如果隐藏了Div 1，我想将Div 2移动到Div 1的占位符，并将Div 5移动到Div 2的占位符。我总是希望Div 3和Div 4在同一条线上。目前，如果我隐藏一个div，则下一个div会向上移动，导致Div 3和Div 4位于两条不同的线上。我研究过AngularJS并且找不到办法吗？有什么想法吗？

更新

<div id="placeholder1"></div>    <div id="placeholder2"></div>
<div id="placeholder3"></div>    <div id="placeholder4"></div>
<div id="placeholder5"></div>    <div id="placeholder6"></div>

<div id="memid">Member ID</div>    <div id="otherid">Other ID</div>
<div id="fName">First Name</div>    <div id="lName">Last Name</div>
<div id="dob">DOB</div>    <div id="otherInfo">Other Info</div>

鉴于网站可能隐藏了会员ID或其他ID，我想将DOB移动到占位符2和其他ID到占位符1或将成员ID保留在占位符1中，同时在同一行保留名字和姓氏。我也在使用bootstrap网格进行布局。

Answer 1

我不明白，哪里需要棱角分明。这个问题只能用css来解决：

div{
float:left;
width:50%;
}

Answer 2

你最好的选择可能是使用javascript来处理这个问题。但是，没有Angular，你可以做到这一点。您可以在包含六个div的节点集中手动移动元素。您也可以尝试从一个div获取html内容并将其移动到另一个div。

if (/*condition that hides div1*/){
    Div1.html(Div2.html());
    Div2.html(Div5.html());
    Div5.hide();
}

您还可以尝试应用手动将元素放置在页面上的css类。

AngularJS：在占位符div

2 个答案: