Angular - HTML中的IF / ELSE条件 [英] Angular - IF /ELSE condition in HTML

问题描述

我有一个简单的angular / html代码，其中有一个表格，每个< li> 都有复选框和一些文本

我的代码如下所示：

 < li ng-repeat =任务中的任务| filter：statusFilter跟踪$ indexng-class ={completed：todo.completed}ng-cloak> 
< div class =view> 
< input class =toggletype =checkboxng-model =todo.completedng-click =changeStatus（task.id）> 
< label ng-dblclick =editTodo（todo）> {{task.text}}< / label> 
< button class =destroyng-click =removeeTask（task）>< / button> 
< / div> 
< form ng-submit =doneEditing（todo）> 
< input class =editng-trim =falseng-model =todo.titleng-blur =doneEditing（todo）todo-escape =revertEditing（todo） focus =todo == editedTodo> 
< / form> 
< / li> 
  

这段代码的作用是：

1. 当用户点击CHECKBOX时，它调用ng-click并更新
   数据库中的active
   
2. 添加completed，基本改变<$所有数据来自一些Web服务，每个任务I包含以下信息：
   
3. id
   
4. 优先权
   
5. 文本
   
6. 活跃
   
   

   我的问题是，当我刷新页面时，我没有任何过滤器添加到所有任务活动是 0 $ b $ p
   
   

   >解决方案

   使用以下内容：

     ng-class ={{completed：todo.active = = 0}}
     

   在这种情况下，如果todo.active等于0， / p>
   

   I have simple angular / html code where I have a table and on each <li> there is checkbox and some text

   My code looks like:

               <li ng-repeat="task in tasks | filter:statusFilter track by $index" ng-class="{completed: todo.completed}" ng-cloak>
                   <div class="view">
                       <input class="toggle" type="checkbox" ng-model="todo.completed" ng-click="changeStatus(task.id)">
                       <label ng-dblclick="editTodo(todo)">{{task.text}}</label>
                       <button class="destroy" ng-click="removeeTask(task)"></button>
                   </div>
                   <form ng-submit="doneEditing(todo)">
                       <input class="edit" ng-trim="false" ng-model="todo.title" ng-blur="doneEditing(todo)" todo-escape="revertEditing(todo)" todo-focus="todo == editedTodo">
                   </form>
               </li>
   

   What this code do is:

   1. When user click CHECKBOX it call ng-click and update "active" in database
   2. Add "completed" which basicly change style of that <li> a bit

   All data comes from some webservices and each task I have contains this information:

7. id
8. priority
9. text
10. active

    My problem is that when I refresh the page I don't have any filter which add completed to all task which active is 0

    Can someone help me how to make some if / else condition for this purpose?

    解决方案

    Use following:

    ng-class="{{completed : todo.active == 0}}"
    

    In this case li-Tag gets class completed if todo.active equals 0

    这篇关于Angular - HTML中的IF / ELSE条件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！