ng-repeat中li项的缩进

Question

我正在使用ng-repeat来显示带有一些文本的列表项.而且我希望每个项目都能从前一个项目向右缩进10-20px.我对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.您可以使用它来计算您的风格.