时间戳

首页 > 解决方案 > AngularJS - 在按钮单击时切换对象值布尔值

javascript - AngularJS - 在按钮单击时切换对象值布尔值

问题描述

我正在构建一个 ToDo 应用程序来学习 Angular JS。

在我的应用程序中，我有一个名为 的数组toDoList，我根据用户的一些输入将对象推入其中，这是在模态的其他地方完成的。

然后该项目显示在 UI 上。

我有一个按钮，我想用它来显示任务已完成。在对象中，属性之一是done，最初设置为false。

单击按钮时，我希望值在数组false中true的特定对象之间切换。toDoList所以不要将所有对象的 done 属性设置为仅生成ng-repeat元素上的特定对象。

我指的按钮是itemComplete按钮。

我曾尝试booleanVal在 上使用切换ng-click，但这会在控制台中为我抛出错误。

索引.html

<div class="row newItem" ng-show="toDoList.length > 0"
     ng-repeat="item in toDoList">
    <div class="col-2">
        <button class="itemComplete btn"
                ng-click="item.done.booleanVal = !item.done.booleanVal">
          <i class="far fa-check-circle fa-2x"></i>
        </button>
    </div>
    <div class="col-8">
        <h4>{{item.project}}</h4>
        <p>{{item.task}}.</p>
    </div>
    <div class="col-2">
        <button class="btn deleteItem"
                ng-click="deleteItem($index); getTaskCount()">
          <i class="far fa-times-circle fa-2x"></i>
        </button>
    </div>
</div>

App.module.js

$scope.toDoList = [];

$scope.addNewToDoTask = function () {
    $scope.toDoList.push({
        project: $scope.projectInput,
        task: $scope.taskInput,
        done: false
    });
    $scope.projectInput = "";
    $scope.taskInput = "";
};

标签： javascriptangularjsangularjs-ng-click

解决方案

尝试item.done.booleanVal用表达式替换item.done。ng-click

推荐阅读