Angularjs push list elements to an array

Angularjs push list elements to an array


Hi Guys Today Discussed Angularjs push list elemetns to an array view list form data push array same method used ionic framework. controller data array push element angularjs push list elements to an array follows code.

Angularjs push list elements to an array
Angularjs push list elements to an array

var app = angular.module('angularjs-starter', []);

Controller

app.controller('MainCtrl', function($scope) {
   $scope.submitForm = function () {
       alert($scope.choicesMade);
   };

  $scope.radioValue = {};
   
  $scope.choicesMade = [];
  
  $scope.wordsPresent=['King', 'Garden', 'America', 'Sky', 'Potato', 'Germany', 'Rose', 'Whisky', 'Mumbai', 'Walk'];

  $scope.pushToArray = function(item) {
    if ($scope.choicesMade.indexOf($scope.radioValue[item]) > -1) {
      alert("already in choices");
      return;
    }
    $scope.choicesMade.push($scope.radioValue[item]);
  }

  $scope.removeFromArray = function(item) {
    
    var index = $scope.choicesMade.indexOf($scope.radioValue[item].substring(1));
    if (index > -1) {
      $scope.choicesMade.splice(index, 1);  
    }
    

  }
});
html page

<!DOCTYPE html>
<html ng-app="angularjs-starter">
  
  <head lang="en">
    <meta charset="utf-8">
    <title>Custom Plunker</title>
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.0.3/angular.min.js"></script>
    <link rel="stylesheet" href="style.css">
    <script>
      document.write('<base href="' + document.location + '" />');
    </script>
    <script src="app.js"></script>
  </head>
  
  <body ng-controller="MainCtrl">
          <div ng-repeat="item in wordsPresent">
            <b>{{ item }}</b><br>
            <label><input type="radio" name="name_{{item}}" ng-change="pushToArray(item)" ng-model="radioValue[item]" value="{{item}}"/> Yes</label>
           <label><input type="radio" name="name_{{item}}" ng-change="removeFromArray(item)" ng-model="radioValue[item]" value="_{{item}}"/> No</label>
          </div>
           <pre>{{choicesMade}}</pre>
  </body> 

</html>


Angularjs push list elements to an array Dev2Tricks 5 of 5
Angularjs push list elements to an array Hi Guys Today Discussed Angularjs push list elemetns to an array view list form data push arr...

Share this

Related Posts

Previous
Next Post »