2016-08-30 6 views
0

私のスコープ内にある配列オブジェクトの要素にブール値プロパティを設定しようとしています。AngularJSアプリケーションの未定義スコープ変数

以下のコードでは、タスク[id] .deleted = trueを設定しようとすると、次のエラーが発生します。

angular.js:12798 TypeError: Cannot set property 'deleted' of undefined 
at Scope.$scope.delete (main.js:54) 

どこが間違っていますか?

私の全体のコードファイルには、次のとおりです。

angular.module('ngMaterialTaskListApp') 
.controller('MainCtrl', function ($scope, $mdDialog, TaskService) { 

    // Model from which View populates data 
    $scope.tasks = []; 
    console.log($scope.tasks); 

    $scope.showAddDialog = function (ev) { 
     $mdDialog.show({ 
      controller: DialogController, 
      templateUrl: '../views/add-dialog-template.html', 
      parent: angular.element(document.body), 
      targetEvent: ev, 
      clickOutsideToClose: true, 
      fullscreen: true, //Only for xs and sm screen sizes 
      locals: { //For DialogController, as tasks 
       tasks: $scope.tasks 
      } 
     }); 
    }; 
    /*----------- Function to delete items onClick of delete icon -----------*/ 
    $scope.delete = function (id) { 
     console.log($scope.tasks[id]); 
     console.log(id); 
     // console.log($scope.tasks[id].name); 
     $scope.tasks[id].deleted = true; 
    }; 

    /*----------- DialogController function -----------*/ 
    function DialogController($scope, $mdDialog, tasks) { 
     $scope.task = {}; 
     $scope.hide = function() { 
      $mdDialog.hide(); 
      //TODO Add a message as to what happened 
     }; 
     $scope.cancel = function() { 
      $mdDialog.cancel(); 
      //TODO Add a message as to what happened 
     }; 
     /*----------- Method show the add dialog -----------*/ 
     $scope.addData = function() { 
      if (null !== $scope.task.name && null !== $scope.task.description) { 
       /*----------- Using moment.js to parse date and time -----------*/ 
       $scope.task.date = moment($scope.task.date, '').format('DD MMM YYYY'); 
       $scope.task.time = moment($scope.task.time, '').format('h:mm a'); 
       $scope.task.done = false; // Every new task is pending! 
       $scope.task.deleted = false; // Every new task exists! 
       var GlobalID = Date.now(); 
       console.log(GlobalID); 
       $scope.task.id = GlobalID; 
       /*----------- Performing http POST -----------*/ 
       TaskService.postTask($scope.task); 
       /*----------- Pushing to tasks object in $scope of MainCtrl -----------*/ 
       // Have to update tasks again 
       tasks.push($scope.task); 
       $scope.hide(); 
       console.log(tasks); //DEBUGGING 
      } else { 
       //TODO ADD INVALID/NULL DATA WARNING 
      } 
     }; 
    }; 
    // DEPRECATED - USED FOR DATA WHEN SERVER NOT AVAILABLE 
    TaskService.getTasks().then(function (response) { 
     $scope.tasks = response.data.tasks; 
    }, function (error) { 
     console.log(error + "This"); 
    }); 
    //USING THIS TO GET DATA FROM SERVER 
    TaskService.getAllTasks().then(function (response) { 
     // console.log(response.data); 
     $scope.tasks = response.data; 
     console.log($scope.tasks); 
    }); 
}); 
+0

チェック:

ng-click="delete(task.id)" 

は次のように入れてみてください:私はNGリピートでボタンの内側に、このようなものです賭けます。タスクが定義されていないために存在します – gianlucatursi

+1

その配列内のアイテムのIDを使用していますが、 '$ scope.tasks [id] .deleted'はアイテムを見つけるためにゼロベースのインデックスを使用します。たとえば、3つの項目を持つ配列は[0]、[1]または[2]になります。値4のIDを渡すと、3つの要素の配列の5番目の要素を検索します。したがって、要素は未定義となり、プロパティは 'deleted'になりません – Jorrex

答えて

0

どのようにあなたのhtmlですか? `$スコープ場合

ng-click="delete($index)"