How do I make sure that each instance of my angular model has certain characteristics?

Question

I have some tasks to do . I want to make sure that each task has a maximumFundPossible property of $1000 constant, a currentfund property that is variable as it will be updated as tasks are being funded , a budget property that is variable but constant for each task item . That task item property has to be set to a certain amount when being created. I guess I will have to add an input field for that amount to be set during task creation ? How ?

I already have my todo tasks but I am stuck as I am a few days new to angular and I hope to fully learn it through this project.

How do I modify my code so that my todo tasks have the described above properties? Also, when I click do button or do for free button, etc, will my current views keep track of that specific task X ? How do I keep track of that task X so that my do , doforfree or any other function I will be using affects only that specific task X.

I know it s too much to ask but angularjs just has a high learning curve. Thanks a lot for your help

Here is my todoController:

facebookExample.controller('todoController', ['$scope', function($scope) {
// Initialize the todo list array
//if local storage is null save the todolist to local storage
$scope.todoList = [];

if (localStorage.getItem("mytodos") === null)
{

 localStorage.setItem("mytodos", angular.toJson($scope.todoList));

 }else
 {
 //set the todolist from local storage
 $scope.todoList = angular.fromJson(localStorage.getItem("mytodos"));
 }


 // Add an item function
 $scope.todoAdd = function() {
 //check to see if text has been entered, if not exit
 if ($scope.todoInput === null || $scope.todoInput === ''){return;}

 //if there is text add it to the array
 $scope.todoList.push({todoText:$scope.todoInput, done:false});

 //clear the textbox
 $scope.todoInput = "";

 //resave the list to localstorage
 localStorage.setItem("mytodos", angular.toJson($scope.todoList));
 };



 // Each task is limited to limit total funding = $1000
 //current funding ; max funding; ballance funding = $1000-current
 // Variables or columns for taskX  





/****************/
// Task Counter for Task X
// If task-assignment is aproved by admin
// Set Task Counter to D-63
// Send reminder to Person assigned for task X in Due Date
// Do for money button is diabled unless task is funded
// Do for free is always enabled unless task is already assigned 








 /**************/
 //Updating state of task to done only on due date
 // if Dtime > DueDate
     // UserX can update task to done

     // Admin is notified by email of the action

     // Admin should aprove of disaprove within 3 days

     // Admin can aprove to Done or  Undone









 /*******************/
 // Admin aproves of Task X to done
 // Task X is updated to state of done


 //if for moeny and amount raised for task >

 // Payment is initiated to Tasker if task was funded and done for money
 // Payment initiated from Company to Admin if task was done for free






  //Do button
  $scope.do = function(){
  // If current user clicks do, 
  // Assign the current user to the task with a state of pending admin aproval

  // Counter variable for dute date is initiated with D-63
  };



 $scope.doForFree = function(){

 // Task is assigned to user with a state of pending-aproval-of-admin-     assignment-do-for-free
 // Admin is notified of do-for-free-request

 };



 // if admin aproves user that requested to do task X for money
   // task X is assigned to that user
   // state of task is assigned to admin-aproved-assignment-for-money
   // the User is notified of admin aproval
   // Task due date is created/updated




// if admin aproves user that requested to do task X for free
  // task X is assigned to that user
  // state of task is assigned to admin-aproved-assignment-for-free
  // the User is notified of admin aproval
  // Task due date is created/updated




 //fund button

 $scope.fund = function(){

 //Redirect current user to paypal for payment to You-Serve


 // Maximum payment cannot exceed Maximum amount - what 's already funded
   // Need to keep track of already funded amount 
   //  Need to keep track of task cost/price







 // If paypal payment was done successfully
    // Update already funded amount 
    // Update maximum amount for extra funding
    // update the fully funded variable/boolean
    // Send task/user/amount to database



 // If payment fails, take out state of being funded
 };





  $scope.remove = function() {
  //copy list
  var oldList = $scope.todoList;
  //clear list
  $scope.todoList = [];
  //cycle through list
  angular.forEach(oldList, function(x) {
  //add any non-done items to todo list
    if (!x.done) $scope.todoList.push(x);
 });
 //update local storage
 localStorage.setItem("mytodos", angular.toJson($scope.todoList));

};

//The Update function
//This waits 100ms to store the data in local storage
$scope.update = function() {
//update local storage 100 ms after the checkbox is clicked to allow it to     process
setTimeout(function(){
 localStorage.setItem("mytodos", angular.toJson($scope.todoList));
 },100);


};

}]);

And here is my view:

<div ng-app="facebookExample" view-title="Tasks">
<div ng-controller="todoController">
<h1>Tasks</h1>

 <div class="item item-input-inset">
 <label class="item-input-wrapper">
 <!-- The actual input tag which is bound to the todoInput using ng-model -->
 <input type="text" placeholder="Add New Item" ng-model="todoInput" size="100"> 
 </label>
 <!-- Our button thay will call our funtion to add a new todo item -->
<button class="button button-small" ng-click="todoAdd()">
Add Task
</button>
</div>

  <div ng-repeat="x in todoList">
  <li class="item item-checkbox">
  &nbsp;&nbsp;&nbsp;<label class="checkbox">
  </label>
  <!-- this is the checkbox element, you will see it is bound to the done setting in the items array -->
  <!-- When clicked it calls the update function to update the item to its done status -->
  <input type="checkbox" ng-model="x.done" ng-click="update()"/>
  <!-- this is a span tag that shows the item text, I am using ng-bind, instead of the span tag we could have used {{x.todoText}} as well -->
  <button class="fund-button" style= "float: left;" ng-click="fund()">Fund</button>
  <span>{{x.todoText}}</span>
  <button class="doButton" style= "float: right; margin-right: 2px;" ng-click="do()">Do</button>
  </li>
  </div>
  <!-- the remove button will call the remove function and remoave all items that   are marked done -->
  <button class="button button-block button-assertive" ng-click="remove()">Remove Checked Tasks
  </button>
  </div>
   </div>:

Answer 1

here is a simple of example of passing an item from ng-repeat to your actions:

  <div ng-controller="MyCtrl">
    <input type="text" ng-model="newMessage">
    <button ng-click="addMessage(newMessage)">
    Add
    </button>
    <ul>
      <li ng-repeat="message in messages">
        {{message}}
        <button ng-click="remove(message, $index)">remove</button>
        <button ng-click="uppercase(message, $index)">uppercase</button>
        <button ng-click="lowercase(message, $index)">lowercase</button>
      </li>
    </ul>
  </div>

controller:

function MyCtrl($scope) {
  $scope.newMessage = '';
  $scope.messages = [];
  $scope.addMessage = function(msg) {
    $scope.messages.push(msg);
  };
  $scope.remove = function(msg, index) {
    $scope.messages.splice(index, 1);
  };
  $scope.uppercase = function(msg, index) {
    $scope.messages[index] = msg.toUpperCase();
  };
  $scope.lowercase = function(msg, index) {
    $scope.messages[index] = msg.toLowerCase();
  };
}

take a look at the jsfiddle and really understand how data is being referenced by your actions. for example, I am using the implicit $index variable to access the array of messages.

http://jsfiddle.net/heavyhorse/x4b2w84c/