title: Angularjs: Use ng-repeat="(key, value) in myObj" to show data from json
body: <p>I am creating one notification app which will send notification through email and SMS. Which will be set to true at starting (cant change json data)</p>
  
  <p>I have created toggle button which will change status of each email and sms to true and false. when changing status to true and false, need to send json data again in below format:</p>
  
  <pre><code>PUT : http://example.url
  {
      "category": "Fruit",
      "method": "EMAIL",
      "enabled": true
  }
  </code></pre>
  
  <p>HTML:</p>
  
  <pre><code>&lt;div class="notification-inner-wrap" ng-repeat="settings in pgxNotification.preferences | orderBy:'order'" &gt;
      &lt;p class="notification-heading"&gt;{{settings.code}}&lt;/p&gt;
      &lt;div ng-repeat="(key, value) in pgxNotification.preferences"&gt;
          &lt;div class="notification-methods"&gt;
              &lt;span&gt;{{settings.methods[0]}}&lt;/span&gt;
              &lt;div class="notification-on-off-icon"&gt;
                  &lt;i class="fa fa-toggle-on active" ng-if="status == true" ng-click="status = !status"&gt;&lt;/i&gt;
                  &lt;i class="fa fa-toggle-on fa-rotate-180 inactive" ng-if="status == false" ng-click="status = !status"&gt;&lt;/i&gt;
              &lt;/div&gt;
              &lt;pre&gt;{{ status }}&lt;/pre&gt;
          &lt;/div&gt;
          &lt;div class="notification-methods"&gt;
              &lt;span&gt;{{settings.methods[1]}}&lt;/span&gt;
              &lt;div class="notification-on-off-icon"&gt;
                  &lt;i class="fa fa-toggle-on active" ng-if="status == true" ng-click="status = !status"&gt;&lt;/i&gt;
                  &lt;i class="fa fa-toggle-on fa-rotate-180 inactive"  ng-if="status == false" ng-click="status = !status"&gt;&lt;/i&gt;
              &lt;/div&gt;
              &lt;pre&gt;{{ status }}&lt;/pre&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>JS:</p>
  
  <pre><code>app.controller('MainCtrl', function($scope) {
    $scope.status = true;
          $scope.changeStatus = function(status){
              $scope.status = !$scope.status;
              //var method = $scope.pgxNotification.methods[index];
  
          }
  
  
    var response = {
          "status" : true,
          "exception" : null,
          "data": {
              "methods": ["SMS","EMAIL","PUSH"],
              "preferences": [
                  {
                      "code": "Fruit",
                      "name": "Fruit content",
                      "methods": ["SMS", "EMAIL"]
                  },
                  {
                      "code": "Vegetable",
                      "name": "Vegetable content",
                      "methods": ["SMS", "EMAIL"]
                  },
                  {
                      "code": "Car",
                      "name": "Car content",
                      "methods": ["SMS", "EMAIL"]
                  },
                  {
                      "code": "bike",
                      "name": "bike content",
                      "methods": ["SMS", "EMAIL"]
                  }
              ]
          }
          };
    $scope.pgxNotification = response.data;
  
  });
  </code></pre>
  
  <p>Here is the plunkr: </p>
  
  <blockquote>
    <p><a href="https://plnkr.co/edit/pIBjao0ujuAzyJGZSPfU?p=preview" rel="nofollow">https://plnkr.co/edit/pIBjao0ujuAzyJGZSPfU?p=preview</a></p>
  </blockquote>
  
  <p>Right now the switch button is not working, and need to figure out on-switch how to send json response in above format.</p>
  
  <p>somewhere I read that need to use <code>ng-repeat="(key, value) in pgxNotification.preferences"</code> to set key value and then send json response. </p>