Sté*_*uca 2 angularjs angularjs-ng-repeat
假设有一个控制器中定义的多种数据类型的列表,如下所示:
$scope.list = [
{text: "Remember BASIC?"},
{code: "10 a = a+1"},
// many additional lines…
];
Run Code Online (Sandbox Code Playgroud)
我们希望根据每种类型在视图中进行插值,如下所示:
<p>Remember BASIC?</p>
<code>10 a = a+1</code>
Run Code Online (Sandbox Code Playgroud)
你会怎么做?
[编辑]澄清要获得什么
List是任意类型的任意数量的"段落"的描述.这是一个更广泛的列表:
$scope.list = [
{text: "Remember BASIC?"},
{code: "10 a = a+1"},
{text: "Bla bla"},
{text: "Bla bla"},
{text: "Bla bla"},
{text: "Bla bla"},
{text: "Bla bla"},
{text: "Bla bla"},
{code: "20 b = a+1"},
{code: "30 c = b+1"},
{text: "Bla bla"},
// many additional lines…
];
Run Code Online (Sandbox Code Playgroud)
并且预期的结果是:
<p>Remember BASIC?</p>
<code>10 a = a+1</code>
<p>Bla bla</p>
<p>Bla bla</p>
<p>Bla bla</p>
<p>Bla bla</p>
<p>Bla bla</p>
<p>Bla bla</p>
<code>20 b = a+1</code>
<code>30 c = b+1</code>
Run Code Online (Sandbox Code Playgroud)
等等
拥有一个引人入胜的标签并不是一个问题,但我不希望每个"段落"都有一个引人入胜的标签.
我不是100%肯定你是什么意思
//许多额外的线......
但如果你的清单看起来像
$scope.list = [
{text: "Remember BASIC?"},
{code: "10 a = a+1"},
{text: "Remember Loundy?"},
{code: "10 a = a+3"}
....
];
Run Code Online (Sandbox Code Playgroud)
您可以使用 ng-repeat-start /end
请看这里http://jsbin.com/zawige/3/edit
<p ng-repeat-start="i in list" ng-if="i.text">{{i.text}}</p>
<code ng-repeat-end ng-if="i.code">{{i.code}}</code>
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
2790 次 |
| 最近记录: |