2014-12-04 63 views
0

如何將一個新行按下ng點擊的方式推向表格? 這是我目前的。信息在一個數組中。用新角度在表格上點擊新角度

我的數組看起來像這樣。

$scope.workflows = [{ 
       Id: 1, 
       Name: "Workflow Page 1", 
       Description: "Describe Workflow", 
       Steps: [{ 
        Id: 1, 
        Name: "name me", 
        Description: "describe me", 
        Action: "do something", 
        Obj: "whats the goal", 
        AdditionalInfo: "anything else", 
       }, { 
        Id: 2, 
        Name: "name me", 
        Description: "describe me", 
        Action: "do something", 
        Obj: "whats the goal", 
        AdditionalInfo: "anything else", 
       }, 
       ]}, 

      }, ]; 

這就是我想要添加到我的數組以及我如何使用範圍來嘗試添加它。

$scope.addStep = function(newStep) { 
    $scope.newStep = [{ 
      Id: 0, 
      Name: "Step on THIS!", 
      Description: "I dare ya!", 
      Action: "STOMP!", 
      Obj: "A Rock", 
      AdditionalInfo: "I am bleeding...", 
     }] 

    $scope.workflows.push(newStep); 
    alert("test :" + "Its GON WORK"); 

}; 

然後在HTML中,我使用ng-click來激活newStep函數,希望它在我的表中創建一個新行。

<div class="text" ng-click="addStep(newStep)"> + Click to Add a New Step</div> 

謝謝!

+0

使用'console.log'或角度的$ log來調試,而不是'alert'進行調試。 – Lekhnath 2014-12-04 18:33:58

回答

0

試着改變你的NG-點擊:NG-點擊= 「addStep()」

然後在您的視圖模型:

$scope.addStep = function() { 
     //all the stuff you have currently 

     $scope.workflows.push($scope.newStep); // line that changed 
    }; 
0

下面的方法將增加在第一個工作流的Steps一個新的臺階。您可以在addStep方法中傳遞工作流程的$index方法,並將0替換爲能夠在$index th工作流程中添加新步驟。

$scope.addStep = function() { 
    $scope.newStep = { 
     Id: 0, 
     Name: "Step on THIS!", 
     Description: "I dare ya!", 
     Action: "STOMP!", 
     Obj: "A Rock", 
     AdditionalInfo: "I am bleeding...", 
    }; 

    $scope.workflows[0].Steps.push($scope.newStep); // It will add a new step ($scope.newStep) in first workflow's Steps 
}; 

<div class="text" ng-click="addStep()"> + Click to Add a New Step</div>