css - ng-repeat 中 li 项的缩进

Question

我正在使用 ng-repeat 来显示带有一些文本的列表项。我希望每个元素都比前一个元素向右缩进 10-20 像素。我对 css 没有太多经验。

<li ng-repeat="todo in todos"
    ng-class="{'selectedToDo': (todo.id == selectedToDo)}">
    {{todo.toDoText}}
</li>

这是一个jsFiddle用我的代码。

提前致谢!

Answer 1

你可以使用ng-style解决您的问题:

<li ng-repeat="todo in todos"
        ng-class="{'selectedToDo': (todo.id == selectedToDo)}" 
        ng-style="{'margin-left': 10*$index+'px'}">

     {{todo.toDoText}}
</li>

$index 是将由 ng-repeat 设置的变量。您可以使用它来计算您的风格。