Pen Settings

HTML

CSS

CSS Base

Vendor Prefixing

Add External Stylesheets/Pens

Any URL's added here will be added as <link>s in order, and before the CSS in the editor. You can use the CSS from another Pen by using it's URL and the proper URL extention.

+ add another resource

JavaScript

Babel includes JSX processing.

Add External Scripts/Pens

Any URL's added here will be added as <script>s in order, and run before the JavaScript in the editor. You can use the URL of any other Pen and it will include the JavaScript from that Pen.

+ add another resource

Packages

Add Packages

Search for and use JavaScript packages from npm here. By selecting a package, an import statement will be added to the top of the JavaScript editor for this package.

Behavior

Save Automatically?

If active, Pens will autosave every 30 seconds after being saved once.

Auto-Updating Preview

If enabled, the preview panel updates automatically as you code. If disabled, use the "Run" button to update.

Format on Save

If enabled, your code will be formatted when you actively save your Pen. Note: your code becomes un-folded during formatting.

Editor Settings

Code Indentation

Want to change your Syntax Highlighting theme, Fonts and more?

Visit your global Editor Settings.

HTML

              
                <div ng-controller="SubheaderAppCtrl" layout="column" flex="" layout-fill="" ng-cloak class="subheaderdemoBasicUsage" ng-app="MyApp">

  <md-toolbar class="md-toolbar-tools md-toolbar" layout="">
    <h2 id="pagetitle">Alkaline / Acid</h2>
    <span flex=""></span>

    <md-button class="md-icon-button" aria-label="More">
      <md-icon md-svg-icon="img/icons/more_vert.svg"></md-icon>
    </md-button>
  </md-toolbar>
  
  <md-content style="">
<!--   <md-content style="" md-theme="altTheme"> -->

    <input type="radio" ng-model="selected" value="" />
    <input type="radio" ng-model="selected" value="Food_Category" />
    <input type="radio" ng-model="selected" value="Alcide" />

    <section>
      <md-subheader class="subheaderInput">

        <!--         <md-button class="md-icon-button" aria-label="More" ng-name="" ng-click="selected = ''" ng-value="">
          <md-icon md-svg-icon="img/icons/more_vert.svg"></md-icon>
        </md-button>

        <md-button class="md-icon-button" aria-label="More" ng-click="selected = 'Food_Category'" ng-value="Food_Category">
          <md-icon md-svg-icon="img/icons/more_vert.svg"></md-icon>
        </md-button>
        
   
        <md-button class="md-icon-button" aria-label="More" ng-name="team" ng-click="selected = 'Alcide'" ng-value="Alcide">
          <md-icon md-svg-icon="img/icons/more_vert.svg"></md-icon>
        </md-button> -->
        
        <!-- INPUT -->
        <md-input-container>
          <label>&nbsp;</label>
          <!--           <md-icon md-svg-src="img/icons/ic_phone_24px.svg"></md-icon> -->
          <input id="query" autocomplete="off" type="text" ng-focus=selected = ''" ng-model="query" ng-model-options="{debounce:50}" input-clear="#8d8d8d" placeholder="Search by food name">
        </md-input-container>

      </md-subheader>

      <md-list ng-repeat="(key, value) in foods | groupBy: selected" layout-padding="">
        <md-subheader class="md-accent subheaderInput color{{ food.Score }}" ng-show="selected">{{ key }} ({{ value.length }})</md-subheader>
<!--         <md-subheader class="md-warn subheaderInput" ng-show="!selected"> All: ({{ foods.length }})</md-subheader> -->
        <md-list-item ng-show="((foods | filter: query).length < foods.length) || (selected != '')" class="" ng-repeat="food in value | filter:query | limitTo:Limit" class="md-1-line">
          <!--           <img ng-src="{{message.face}}" class="md-avatar" alt="{{message.who}}"> -->

          <div class="md-list-item-text">
            <p>{{ ::food.Food_Category }}: <b>{{ ::food.Aliment }}</b></p>
            <div class="color{{ food.Score }} square md-secondary">{{ ::food.Alcide }}</div>
          </div>
        </md-list-item>
      </md-list>
    </section>

    <!--     <section>
      <md-subheader class="">
        <md-icon md-svg-src="img/icons/ic_phone_24px.svg"></md-icon> Highly Alkaline (25)</md-subheader>
      <md-list layout="column" layout-padding="">
        <md-list-item class="md-3-line" ng-repeat="message in messages">
          <img ng-src="{{message.face}}" class="md-avatar" alt="{{message.who}}">
          <div class="md-list-item-text">
            <h3>{{message.what}}</h3>
            <h4>{{message.who}}</h4>
            <p>
              {{message.notes}}
            </p>
          </div>
        </md-list-item>
      </md-list>
    </section> -->

  </md-content>
</div>

<!--
Copyright 2016 Google Inc. All Rights Reserved. 
Use of this source code is governed by an MIT-style license that can be foundin the LICENSE file at https://material.angularjs.org/HEAD/license.
-->
              
            
!

CSS

              
                .subheaderdemoBasicUsage .face {
  border-radius: 30px;
  border: 1px solid #ddd;
  width: 48px;
  margin: 16px;
}

/* GC */

.subheaderInput .md-subheader-content {
  max-height: 44px;
}

.subheaderInput md-input-container {
  width: 100%;
  margin: 0;
}

.subheaderInput .md-subheader-inner {
/*   padding: 10px 16px 2px; */
}
.subheaderInput .md-subheader-inner {
    padding: 10px 16px 2px 8px;
/*   padding: 6px 8px; */
}

.md-list-item-text {
  width: 100%;
/*   border-bottom: 1px solid #ddd; */
}
md-list-item {
border-bottom: 1px solid #ddd;
}


ul {
  padding: 0;
  list-style-type: none;
}

li {
  padding: 8px 0;
  border-bottom: solid 1px #ccc
}

.animate-show.ng-hide-add.ng-hide-add-active,
.animate-show.ng-hide-remove.ng-hide-remove-active {
  -webkit-transition: all cubic-bezier(0.250, 0.460, 0.450, 0.940) .2s !important;
  transition: all cubic-bezier(0.250, 0.460, 0.450, 0.940) .2s !important;
}

.animate-show.ng-hide {
  opacity: 0 !important;
}

.square {
  /*   width: 20px; */
  /*   height: 12px; */
  font-size: 14px;
  float: right;
  padding: 3px 4px;
  color: #fff;
/*   border-radius: 3px; */
  /*   font-weight: bold */
}

.color1 {
  background-color: #DCEDC8;
  color: #333;
}

.color2 {
  background-color: #AED581;
  color: #fff;
}

.color3 {
  background-color: #7CB342;
  color: #fff;
}

.color4 {
  background-color: #33691E;
  color: #fff;
}

.color-1 {
  background-color: #FFF9C4;
  color: #333;
}

.color-2 {
  background-color: #FFF176;
  color: #333;
}

.color-3 {
  background-color: #FDD835;
  color: #fff;
}

.color-4 {
  background-color: #F57F17;
  color: #fff;
}
              
            
!

JS

              
                angular.module('MyApp', ['ngMaterial', 'ngMessages', 'angular.filter', 'material.svgAssetsCache'])
  .config(function($mdThemingProvider) {
    $mdThemingProvider.theme('default')
      .primaryPalette('green')
      .accentPalette('green', {
        'default': '700' // use shade 200 for default, and keep all other shades the same
      });
    // #7CB342
    // .primaryPalette('green', {
    //           'default': '700', // by default use shade from the palette for primary intentions
    //           'hue-1': 'A400', // use shade for the <code>md-hue-1</code> class
    //           'hue-2': '600', // use shade for the <code>md-hue-2</code> class
    //           'hue-3': 'A100' // use shade for the <code>md-hue-3</code> class
    //       })
    //       // If you specify less than all of the keys, it will inherit from the default shades
    //       .accentPalette('deep-purple', {
    //           'default': '200' // use shade 200 for default, and keep all other shades the same
    //       })

  })

.controller('SubheaderAppCtrl', function($scope) {
  
    // $scope.focus = function(msg) {
    //     alert(msg+' FUCK')
    // };

    //$scope.foods = {}; 
  
  $scope.Limit = 15;

    $scope.foods = [{
      "Aliment": "Brocoflower",
      "Food_Category": "Bean",
      "Alcide": "Highly Alkaline",
      "Score": "4",
      "Color": "green",
      "id": 0
    }, {
      "Aliment": "Mineral Water",
      "Food_Category": "Beverage",
      "Alcide": "Highly Alkaline",
      "Score": "4",
      "Color": "green",
      "id": 1
    }, {
      "Aliment": "Lime",
      "Food_Category": "Fruits",
      "Alcide": "Highly Alkaline",
      "Score": "4",
      "Color": "green",
      "id": 2
    }, {
      "Aliment": "Nectarine",
      "Food_Category": "Fruits",
      "Alcide": "Highly Alkaline",
      "Score": "4",
      "Color": "green",
      "id": 3
    }, {
      "Aliment": "Persimmon",
      "Food_Category": "Fruits",
      "Alcide": "Highly Alkaline",
      "Score": "4",
      "Color": "green",
      "id": 4
    }, {
      "Aliment": "Raspberry",
      "Food_Category": "Fruits",
      "Alcide": "Highly Alkaline",
      "Score": "4",
      "Color": "green",
      "id": 5
    }, {
      "Aliment": "Pineapple",
      "Food_Category": "Fruit",
      "Alcide": "Highly Alkaline",
      "Score": "4",
      "Color": "green",
      "id": 6
    }, {
      "Aliment": "Tangerine",
      "Food_Category": "Fruit",
      "Alcide": "Highly Alkaline",
      "Score": "4",
      "Color": "green",
      "id": 7
    }, {
      "Aliment": "Watermelon",
      "Food_Category": "Fruit",
      "Alcide": "Highly Alkaline",
      "Score": "4",
      "Color": "green",
      "id": 8
    }, {
      "Aliment": "Onion/Miso",
      "Food_Category": "Legume",
      "Alcide": "Highly Alkaline",
      "Score": "4",
      "Color": "green",
      "id": 9
    }, {
      "Aliment": "Hydrogenated Oil",
      "Food_Category": "Oil",
      "Alcide": "Highly Alkaline",
      "Score": "4",
      "Color": "green",
      "id": 10
    }, {
      "Aliment": "Lentil",
      "Food_Category": "Oil",
      "Alcide": "Highly Alkaline",
      "Score": "4",
      "Color": "green",
      "id": 11
    }, {
      "Aliment": "Sea Salt",
      "Food_Category": "Preservative",
      "Alcide": "Highly Alkaline",
      "Score": "4",
      "Color": "green",
      "id": 12
    }, {
      "Aliment": "Daikon/Taro Root",
      "Food_Category": "Pulse",
      "Alcide": "Highly Alkaline",
      "Score": "4",
      "Color": "green",
      "id": 13
    }, {
      "Aliment": "Burdock/Lotus Root",
      "Food_Category": "Root",
      "Alcide": "Highly Alkaline",
      "Score": "4",
      "Color": "green",
      "id": 14
    }, {
      "Aliment": "Dandelion Greens",
      "Food_Category": "Root",
      "Alcide": "Highly Alkaline",
      "Score": "4",
      "Color": "green",
      "id": 15
    }, {
      "Aliment": "Sea Vegetables (other)",
      "Food_Category": "Root",
      "Alcide": "Highly Alkaline",
      "Score": "4",
      "Color": "green",
      "id": 16
    }, {
      "Aliment": "Sweet Potato/Yam",
      "Food_Category": "Root",
      "Alcide": "Highly Alkaline",
      "Score": "4",
      "Color": "green",
      "id": 17
    }, {
      "Aliment": "Pumpkin Seed",
      "Food_Category": "Seed/Sprout",
      "Alcide": "Highly Alkaline",
      "Score": "4",
      "Color": "green",
      "id": 18
    }, {
      "Aliment": "Baking Soda",
      "Food_Category": "Spice/Herb",
      "Alcide": "Highly Alkaline",
      "Score": "4",
      "Color": "green",
      "id": 19
    }, {
      "Aliment": "Umeboshi Plum",
      "Food_Category": "Therapeutic",
      "Alcide": "Highly Alkaline",
      "Score": "4",
      "Color": "green",
      "id": 20
    }, {
      "Aliment": "Noril|Kombu|Wakame|Hijiki",
      "Food_Category": "Vegetable",
      "Alcide": "Highly Alkaline",
      "Score": "4",
      "Color": "green",
      "id": 21
    }, {
      "Aliment": "Spinach",
      "Food_Category": "Vegetable",
      "Alcide": "Highly Alkaline",
      "Score": "4",
      "Color": "green",
      "id": 22
    }, {
      "Aliment": "Seaweed",
      "Food_Category": "Vegetable",
      "Alcide": "Highly Alkaline",
      "Score": "4",
      "Color": "green",
      "id": 23
    }, {
      "Aliment": "Stevia",
      "Food_Category": "Sweetner",
      "Alcide": "Highly Alkaline",
      "Score": "4",
      "Color": "green",
      "id": 24
    }, {
      "Aliment": "Parsnip/Taro",
      "Food_Category": "Bean",
      "Alcide": "Moderately Alkaline",
      "Score": "3",
      "Color": "green",
      "id": 25
    }, {
      "Aliment": "Kambucha",
      "Food_Category": "Beverage",
      "Alcide": "Moderately Alkaline",
      "Score": "3",
      "Color": "green",
      "id": 26
    }, {
      "Aliment": "Grapefruit",
      "Food_Category": "Fruits",
      "Alcide": "Moderately Alkaline",
      "Score": "3",
      "Color": "green",
      "id": 27
    }, {
      "Aliment": "Canteloupe",
      "Food_Category": "Fruits",
      "Alcide": "Moderately Alkaline",
      "Score": "3",
      "Color": "green",
      "id": 28
    }, {
      "Aliment": "Honeydew",
      "Food_Category": "Fruits",
      "Alcide": "Moderately Alkaline",
      "Score": "3",
      "Color": "green",
      "id": 29
    }, {
      "Aliment": "Carrot",
      "Food_Category": "Vegetable",
      "Alcide": "Moderately Alkaline",
      "Score": "3",
      "Color": "green",
      "id": 30
    }, {
      "Aliment": "Citrus",
      "Food_Category": "Fruits",
      "Alcide": "Moderately Alkaline",
      "Score": "3",
      "Color": "green",
      "id": 31
    }, {
      "Aliment": "Loganberry",
      "Food_Category": "Fruit",
      "Alcide": "Moderately Alkaline",
      "Score": "3",
      "Color": "green",
      "id": 32
    }, {
      "Aliment": "Dewberry",
      "Food_Category": "Fruit",
      "Alcide": "Moderately Alkaline",
      "Score": "3",
      "Color": "green",
      "id": 33
    }, {
      "Aliment": "Olive",
      "Food_Category": "Fruit",
      "Alcide": "Moderately Alkaline",
      "Score": "3",
      "Color": "green",
      "id": 34
    }, {
      "Aliment": "Mango",
      "Food_Category": "Fruit",
      "Alcide": "Moderately Alkaline",
      "Score": "3",
      "Color": "green",
      "id": 35
    }, {
      "Aliment": "Kale/Parsley",
      "Food_Category": "Legume",
      "Alcide": "Moderately Alkaline",
      "Score": "3",
      "Color": "green",
      "id": 36
    }, {
      "Aliment": "Poppy Seed",
      "Food_Category": "Nut",
      "Alcide": "Moderately Alkaline",
      "Score": "3",
      "Color": "green",
      "id": 37
    }, {
      "Aliment": "Kohlrabi",
      "Food_Category": "Oil",
      "Alcide": "Moderately Alkaline",
      "Score": "3",
      "Color": "green",
      "id": 38
    }, {
      "Aliment": "Chestnut",
      "Food_Category": "Oil",
      "Alcide": "Moderately Alkaline",
      "Score": "3",
      "Color": "green",
      "id": 39
    }, {
      "Aliment": "Pepper",
      "Food_Category": "Oil",
      "Alcide": "Moderately Alkaline",
      "Score": "3",
      "Color": "green",
      "id": 40
    }, {
      "Aliment": "Endive/Arugula",
      "Food_Category": "Pulse",
      "Alcide": "Moderately Alkaline",
      "Score": "3",
      "Color": "green",
      "id": 41
    }, {
      "Aliment": "Ginger Root",
      "Food_Category": "Root",
      "Alcide": "Moderately Alkaline",
      "Score": "3",
      "Color": "green",
      "id": 42
    }, {
      "Aliment": "Jerusalem Artichoke",
      "Food_Category": "Root",
      "Alcide": "Moderately Alkaline",
      "Score": "3",
      "Color": "green",
      "id": 43
    }, {
      "Aliment": "Mustard Greens",
      "Food_Category": "Root",
      "Alcide": "Moderately Alkaline",
      "Score": "3",
      "Color": "green",
      "id": 44
    }, {
      "Aliment": "Broccoli",
      "Food_Category": "Root",
      "Alcide": "Moderately Alkaline",
      "Score": "3",
      "Color": "green",
      "id": 45
    }, {
      "Aliment": "Cashew",
      "Food_Category": "Seed/Sprout",
      "Alcide": "Moderately Alkaline",
      "Score": "3",
      "Color": "green",
      "id": 46
    }, {
      "Aliment": "Spices/Cinnamon",
      "Food_Category": "Spice/Herb",
      "Alcide": "Moderately Alkaline",
      "Score": "3",
      "Color": "green",
      "id": 47
    }, {
      "Aliment": "Agave",
      "Food_Category": "Spice/Herb",
      "Alcide": "Moderately Alkaline",
      "Score": "3",
      "Color": "green",
      "id": 48
    }, {
      "Aliment": "Black Cohash",
      "Food_Category": "Spice/Herb",
      "Alcide": "Moderately Alkaline",
      "Score": "3",
      "Color": "green",
      "id": 49
    }, {
      "Aliment": "Licorice",
      "Food_Category": "Spice/Herb",
      "Alcide": "Moderately Alkaline",
      "Score": "3",
      "Color": "green",
      "id": 50
    }, {
      "Aliment": "Valerian",
      "Food_Category": "Spice/Herb",
      "Alcide": "Moderately Alkaline",
      "Score": "3",
      "Color": "green",
      "id": 51
    }, {
      "Aliment": "Molasses",
      "Food_Category": "Sweetner",
      "Alcide": "Moderately Alkaline",
      "Score": "3",
      "Color": "green",
      "id": 52
    }, {
      "Aliment": "Asparagus",
      "Food_Category": "Vegetable",
      "Alcide": "Moderately Alkaline",
      "Score": "3",
      "Color": "green",
      "id": 53
    }, {
      "Aliment": "Garlic",
      "Food_Category": "Vegetable",
      "Alcide": "Moderately Alkaline",
      "Score": "3",
      "Color": "green",
      "id": 54
    }, {
      "Aliment": "Soy Sauce",
      "Food_Category": "Vinegar",
      "Alcide": "Moderately Alkaline",
      "Score": "3",
      "Color": "green",
      "id": 55
    }, {
      "Aliment": "Mushroom/Fungi",
      "Food_Category": "Bean",
      "Alcide": "Low Alkaline",
      "Score": "2",
      "Color": "green",
      "id": 56
    }, {
      "Aliment": "Green Tea / Mu Tea",
      "Food_Category": "Beverage",
      "Alcide": "Low Alkaline",
      "Score": "2",
      "Color": "green",
      "id": 57
    }, {
      "Aliment": "Lemon",
      "Food_Category": "Fruits",
      "Alcide": "Low Alkaline",
      "Score": "2",
      "Color": "green",
      "id": 58
    }, {
      "Aliment": "Pear",
      "Food_Category": "Fruits",
      "Alcide": "Low Alkaline",
      "Score": "2",
      "Color": "green",
      "id": 59
    }, {
      "Aliment": "Avocado",
      "Food_Category": "Fruits",
      "Alcide": "Low Alkaline",
      "Score": "2",
      "Color": "green",
      "id": 60
    }, {
      "Aliment": "Apple",
      "Food_Category": "Fruits",
      "Alcide": "Low Alkaline",
      "Score": "2",
      "Color": "green",
      "id": 61
    }, {
      "Aliment": "Quail Egg",
      "Food_Category": "Egg",
      "Alcide": "Low Alkaline",
      "Score": "2",
      "Color": "green",
      "id": 62
    }, {
      "Aliment": "Peach",
      "Food_Category": "Fruit",
      "Alcide": "Low Alkaline",
      "Score": "2",
      "Color": "green",
      "id": 63
    }, {
      "Aliment": "Cherry",
      "Food_Category": "Fruit",
      "Alcide": "Low Alkaline",
      "Score": "2",
      "Color": "green",
      "id": 64
    }, {
      "Aliment": "Blackberry",
      "Food_Category": "Fruit",
      "Alcide": "Low Alkaline",
      "Score": "2",
      "Color": "green",
      "id": 65
    }, {
      "Aliment": "Papaya",
      "Food_Category": "Fruit",
      "Alcide": "Low Alkaline",
      "Score": "2",
      "Color": "green",
      "id": 66
    }, {
      "Aliment": "Rutabaga",
      "Food_Category": "Legume",
      "Alcide": "Low Alkaline",
      "Score": "2",
      "Color": "green",
      "id": 67
    }, {
      "Aliment": "Primrose Oil",
      "Food_Category": "Nut",
      "Alcide": "Low Alkaline",
      "Score": "2",
      "Color": "green",
      "id": 68
    }, {
      "Aliment": "Sprout",
      "Food_Category": "Oil",
      "Alcide": "Low Alkaline",
      "Score": "2",
      "Color": "green",
      "id": 69
    }, {
      "Aliment": "Potato/Bell Pepper",
      "Food_Category": "Oil",
      "Alcide": "Low Alkaline",
      "Score": "2",
      "Color": "green",
      "id": 70
    }, {
      "Aliment": "Cod Liver Oil",
      "Food_Category": "Oil",
      "Alcide": "Low Alkaline",
      "Score": "2",
      "Color": "green",
      "id": 71
    }, {
      "Aliment": "Almond",
      "Food_Category": "Oil",
      "Alcide": "Low Alkaline",
      "Score": "2",
      "Color": "green",
      "id": 72
    }, {
      "Aliment": "Salsify/Ginseng",
      "Food_Category": "Pulse",
      "Alcide": "Low Alkaline",
      "Score": "2",
      "Color": "green",
      "id": 73
    }, {
      "Aliment": "Collard Greens",
      "Food_Category": "Root",
      "Alcide": "Low Alkaline",
      "Score": "2",
      "Color": "green",
      "id": 74
    }, {
      "Aliment": "Pumpkin",
      "Food_Category": "Root",
      "Alcide": "Low Alkaline",
      "Score": "2",
      "Color": "green",
      "id": 75
    }, {
      "Aliment": "Eggplant",
      "Food_Category": "Root",
      "Alcide": "Low Alkaline",
      "Score": "2",
      "Color": "green",
      "id": 76
    }, {
      "Aliment": "Sesame Seed",
      "Food_Category": "Seed/Sprout",
      "Alcide": "Low Alkaline",
      "Score": "2",
      "Color": "green",
      "id": 77
    }, {
      "Aliment": "Herbs (most): Arnica,",
      "Food_Category": "Spice/Herb",
      "Alcide": "Low Alkaline",
      "Score": "2",
      "Color": "green",
      "id": 78
    }, {
      "Aliment": "Goldenseal, Lemongrass",
      "Food_Category": "Spice/Herb",
      "Alcide": "Low Alkaline",
      "Score": "2",
      "Color": "green",
      "id": 79
    }, {
      "Aliment": "Ephedra, Feverfew,",
      "Food_Category": "Spice/Herb",
      "Alcide": "Low Alkaline",
      "Score": "2",
      "Color": "green",
      "id": 80
    }, {
      "Aliment": "Chrysanthemum,",
      "Food_Category": "Spice/Herb",
      "Alcide": "Low Alkaline",
      "Score": "2",
      "Color": "green",
      "id": 81
    }, {
      "Aliment": "Bergamot, Echinacea",
      "Food_Category": "Spice/Herb",
      "Alcide": "Low Alkaline",
      "Score": "2",
      "Color": "green",
      "id": 82
    }, {
      "Aliment": "Aloe Vera",
      "Food_Category": "Spice/Herb",
      "Alcide": "Low Alkaline",
      "Score": "2",
      "Color": "green",
      "id": 83
    }, {
      "Aliment": "Angelica",
      "Food_Category": "Spice/Herb",
      "Alcide": "Low Alkaline",
      "Score": "2",
      "Color": "green",
      "id": 84
    }, {
      "Aliment": "Nettle",
      "Food_Category": "Spice/Herb",
      "Alcide": "Low Alkaline",
      "Score": "2",
      "Color": "green",
      "id": 85
    }, {
      "Aliment": "Rice Syrup",
      "Food_Category": "Sweetner",
      "Alcide": "Low Alkaline",
      "Score": "2",
      "Color": "green",
      "id": 86
    }, {
      "Aliment": "Sake",
      "Food_Category": "Therapeutic",
      "Alcide": "Low Alkaline",
      "Score": "2",
      "Color": "green",
      "id": 87
    }, {
      "Aliment": "Cabbage",
      "Food_Category": "Vegetable",
      "Alcide": "Low Alkaline",
      "Score": "2",
      "Color": "green",
      "id": 88
    }, {
      "Aliment": "Cauliflower",
      "Food_Category": "Vegetable",
      "Alcide": "Low Alkaline",
      "Score": "2",
      "Color": "green",
      "id": 89
    }, {
      "Aliment": "Apple Cider Vinegar",
      "Food_Category": "Vinegar",
      "Alcide": "Low Alkaline",
      "Score": "2",
      "Color": "green",
      "id": 90
    }, {
      "Aliment": "Beet",
      "Food_Category": "Bean",
      "Alcide": "Very Low Alkaline",
      "Score": "1",
      "Color": "green",
      "id": 91
    }, {
      "Aliment": "Ginger Tea",
      "Food_Category": "Beverage",
      "Alcide": "Very Low Alkaline",
      "Score": "1",
      "Color": "green",
      "id": 92
    }, {
      "Aliment": "Quinoa",
      "Food_Category": "Cereal",
      "Alcide": "Very Low Alkaline",
      "Score": "1",
      "Color": "green",
      "id": 93
    }, {
      "Aliment": "Orange",
      "Food_Category": "Fruits",
      "Alcide": "Very Low Alkaline",
      "Score": "1",
      "Color": "green",
      "id": 94
    }, {
      "Aliment": "Apricot",
      "Food_Category": "Fruits",
      "Alcide": "Very Low Alkaline",
      "Score": "1",
      "Color": "green",
      "id": 95
    }, {
      "Aliment": "Banana",
      "Food_Category": "Fruits",
      "Alcide": "Very Low Alkaline",
      "Score": "1",
      "Color": "green",
      "id": 96
    }, {
      "Aliment": "Blueberry",
      "Food_Category": "Fruits",
      "Alcide": "Very Low Alkaline",
      "Score": "1",
      "Color": "green",
      "id": 97
    }, {
      "Aliment": "Human Breast Milk",
      "Food_Category": "Cow/Human",
      "Alcide": "Very Low Alkaline",
      "Score": "1",
      "Color": "green",
      "id": 98
    }, {
      "Aliment": "Duck Egg",
      "Food_Category": "Egg",
      "Alcide": "Very Low Alkaline",
      "Score": "1",
      "Color": "green",
      "id": 99
    }, {
      "Aliment": "Oat",
      "Food_Category": "Fowl",
      "Alcide": "Very Low Alkaline",
      "Score": "1",
      "Color": "green",
      "id": 100
    }, {
      "Aliment": "Grape",
      "Food_Category": "Fruit",
      "Alcide": "Very Low Alkaline",
      "Score": "1",
      "Color": "green",
      "id": 101
    }, {
      "Aliment": "Raisin, Currant",
      "Food_Category": "Fruit",
      "Alcide": "Very Low Alkaline",
      "Score": "1",
      "Color": "green",
      "id": 102
    }, {
      "Aliment": "Pineapple Juice",
      "Food_Category": "Fruit",
      "Alcide": "Very Low Alkaline",
      "Score": "1",
      "Color": "green",
      "id": 103
    }, {
      "Aliment": "Strawberry",
      "Food_Category": "Fruit",
      "Alcide": "Very Low Alkaline",
      "Score": "1",
      "Color": "green",
      "id": 104
    }, {
      "Aliment": "Grain Coffee",
      "Food_Category": "Grain",
      "Alcide": "Very Low Alkaline",
      "Score": "1",
      "Color": "green",
      "id": 105
    }, {
      "Aliment": "Japonica Rice",
      "Food_Category": "Grass",
      "Alcide": "Very Low Alkaline",
      "Score": "1",
      "Color": "green",
      "id": 106
    }, {
      "Aliment": "Wild Rice",
      "Food_Category": "Grass",
      "Alcide": "Very Low Alkaline",
      "Score": "1",
      "Color": "green",
      "id": 107
    }, {
      "Aliment": "Okra/Cucumber",
      "Food_Category": "Legume",
      "Alcide": "Very Low Alkaline",
      "Score": "1",
      "Color": "green",
      "id": 108
    }, {
      "Aliment": "Avocado Oil",
      "Food_Category": "Nut",
      "Alcide": "Very Low Alkaline",
      "Score": "1",
      "Color": "green",
      "id": 109
    }, {
      "Aliment": "Linseed/Flax Oil",
      "Food_Category": "Oil",
      "Alcide": "Very Low Alkaline",
      "Score": "1",
      "Color": "green",
      "id": 110
    }, {
      "Aliment": "Brussel Sprout",
      "Food_Category": "Oil",
      "Alcide": "Very Low Alkaline",
      "Score": "1",
      "Color": "green",
      "id": 111
    }, {
      "Aliment": "Coconut Oil",
      "Food_Category": "Oil",
      "Alcide": "Very Low Alkaline",
      "Score": "1",
      "Color": "green",
      "id": 112
    }, {
      "Aliment": "Olive/Macadamia Oil",
      "Food_Category": "Oil",
      "Alcide": "Very Low Alkaline",
      "Score": "1",
      "Color": "green",
      "id": 113
    }, {
      "Aliment": "Sulfite",
      "Food_Category": "Preservative",
      "Alcide": "Very Low Alkaline",
      "Score": "1",
      "Color": "green",
      "id": 114
    }, {
      "Aliment": "Ghee (Clarified Butter)",
      "Food_Category": "Processed Dairy",
      "Alcide": "Very Low Alkaline",
      "Score": "1",
      "Color": "green",
      "id": 115
    }, {
      "Aliment": "Turnip Greens",
      "Food_Category": "Pulse",
      "Alcide": "Very Low Alkaline",
      "Score": "1",
      "Color": "green",
      "id": 116
    }, {
      "Aliment": "Lettuce",
      "Food_Category": "Root",
      "Alcide": "Very Low Alkaline",
      "Score": "1",
      "Color": "green",
      "id": 117
    }, {
      "Aliment": "Artichoke",
      "Food_Category": "Root",
      "Alcide": "Very Low Alkaline",
      "Score": "1",
      "Color": "green",
      "id": 118
    }, {
      "Aliment": "Squash",
      "Food_Category": "Root",
      "Alcide": "Very Low Alkaline",
      "Score": "1",
      "Color": "green",
      "id": 119
    }, {
      "Aliment": "Jicama",
      "Food_Category": "Root",
      "Alcide": "Very Low Alkaline",
      "Score": "1",
      "Color": "green",
      "id": 120
    }, {
      "Aliment": "Seeds (most)",
      "Food_Category": "Seed/Sprout",
      "Alcide": "Very Low Alkaline",
      "Score": "1",
      "Color": "green",
      "id": 121
    }, {
      "Aliment": "White Willow Bark",
      "Food_Category": "Spice/Herb",
      "Alcide": "Very Low Alkaline",
      "Score": "1",
      "Color": "green",
      "id": 122
    }, {
      "Aliment": "Artemesia Annua",
      "Food_Category": "Spice/Herb",
      "Alcide": "Very Low Alkaline",
      "Score": "1",
      "Color": "green",
      "id": 123
    }, {
      "Aliment": "Slippery Elm",
      "Food_Category": "Spice/Herb",
      "Alcide": "Very Low Alkaline",
      "Score": "1",
      "Color": "green",
      "id": 124
    }, {
      "Aliment": "Sucanat",
      "Food_Category": "Sweetner",
      "Alcide": "Very Low Alkaline",
      "Score": "1",
      "Color": "green",
      "id": 125
    }, {
      "Aliment": "Algae, Blue Green",
      "Food_Category": "Therapeutic",
      "Alcide": "Very Low Alkaline",
      "Score": "1",
      "Color": "green",
      "id": 126
    }, {
      "Aliment": "Celery/Scallion",
      "Food_Category": "Vegetable",
      "Alcide": "Very Low Alkaline",
      "Score": "1",
      "Color": "green",
      "id": 127
    }, {
      "Aliment": "Chive/Cilantro",
      "Food_Category": "Vegetable",
      "Alcide": "Very Low Alkaline",
      "Score": "1",
      "Color": "green",
      "id": 128
    }, {
      "Aliment": "White Rice, White Bread, Pastries, Biscuits, Pasta, Chip",
      "Food_Category": "Cereal",
      "Alcide": "Low Acidic",
      "Score": "-2",
      "Color": "red",
      "id": 129
    }, {
      "Aliment": "Umeboshi Vinegar",
      "Food_Category": "Vinegar",
      "Alcide": "Very Low Alkaline",
      "Score": "1",
      "Color": "green",
      "id": 129
    }, {
      "Aliment": "Fava Bean",
      "Food_Category": "Bean",
      "Alcide": "Very Low Acidic",
      "Score": "-1",
      "Color": "red",
      "id": 130
    }, {
      "Aliment": "Kona Coffee",
      "Food_Category": "Beverage",
      "Alcide": "Very Low Acidic",
      "Score": "-1",
      "Color": "red",
      "id": 131
    }, {
      "Aliment": "Rye Bread/Whole Grain Bread/Oats/Brown Rice",
      "Food_Category": "Cereal",
      "Alcide": "Very Low Acidic",
      "Score": "-1",
      "Color": "red",
      "id": 132
    }, {
      "Aliment": "Kasha",
      "Food_Category": "Cereal",
      "Alcide": "Very Low Acidic",
      "Score": "-1",
      "Color": "red",
      "id": 133
    }, {
      "Aliment": "Coconut",
      "Food_Category": "Fruits",
      "Alcide": "Very Low Acidic",
      "Score": "-1",
      "Color": "red",
      "id": 134
    }, {
      "Aliment": "Guava",
      "Food_Category": "Fruits",
      "Alcide": "Very Low Acidic",
      "Score": "-1",
      "Color": "red",
      "id": 135
    }, {
      "Aliment": "Pickled Fruit",
      "Food_Category": "Fruits",
      "Alcide": "Very Low Acidic",
      "Score": "-1",
      "Color": "red",
      "id": 136
    }, {
      "Aliment": "Dry Fruit",
      "Food_Category": "Fruits",
      "Alcide": "Very Low Acidic",
      "Score": "-1",
      "Color": "red",
      "id": 137
    }, {
      "Aliment": "Yogurt",
      "Food_Category": "Cow/Human",
      "Alcide": "Very Low Acidic",
      "Score": "-1",
      "Color": "red",
      "id": 138
    }, {
      "Aliment": "Chicken Egg",
      "Food_Category": "Egg",
      "Alcide": "Very Low Acidic",
      "Score": "-1",
      "Color": "red",
      "id": 139
    }, {
      "Aliment": "Fish",
      "Food_Category": "Fish/Shell Fish",
      "Alcide": "Very Low Acidic",
      "Score": "-1",
      "Color": "red",
      "id": 140
    }, {
      "Aliment": "Triticale",
      "Food_Category": "Fowl",
      "Alcide": "Very Low Acidic",
      "Score": "-1",
      "Color": "red",
      "id": 141
    }, {
      "Aliment": "Wild Duck",
      "Food_Category": "Fowl",
      "Alcide": "Very Low Acidic",
      "Score": "-1",
      "Color": "red",
      "id": 142
    }, {
      "Aliment": "Cherimoya",
      "Food_Category": "Fruit",
      "Alcide": "Very Low Acidic",
      "Score": "-1",
      "Color": "red",
      "id": 143
    }, {
      "Aliment": "Persimmon Juice",
      "Food_Category": "Fruit",
      "Alcide": "Very Low Acidic",
      "Score": "-1",
      "Color": "red",
      "id": 144
    }, {
      "Aliment": "Fig",
      "Food_Category": "Fruit",
      "Alcide": "Very Low Acidic",
      "Score": "-1",
      "Color": "red",
      "id": 145
    }, {
      "Aliment": "Date",
      "Food_Category": "Fruit",
      "Alcide": "Very Low Acidic",
      "Score": "-1",
      "Color": "red",
      "id": 146
    }, {
      "Aliment": "Venison",
      "Food_Category": "Game",
      "Alcide": "Very Low Acidic",
      "Score": "-1",
      "Color": "red",
      "id": 147
    }, {
      "Aliment": "Goat/Sheep Cheese",
      "Food_Category": "Goat/Sheep",
      "Alcide": "Very Low Acidic",
      "Score": "-1",
      "Color": "red",
      "id": 148
    }, {
      "Aliment": "Millet",
      "Food_Category": "Grain",
      "Alcide": "Very Low Acidic",
      "Score": "-1",
      "Color": "red",
      "id": 149
    }, {
      "Aliment": "Brown Rice",
      "Food_Category": "Grass",
      "Alcide": "Very Low Acidic",
      "Score": "-1",
      "Color": "red",
      "id": 150
    }, {
      "Aliment": "Amaranth",
      "Food_Category": "Grass",
      "Alcide": "Very Low Acidic",
      "Score": "-1",
      "Color": "red",
      "id": 151
    }, {
      "Aliment": "String/Wax Bean",
      "Food_Category": "Legume",
      "Alcide": "Very Low Acidic",
      "Score": "-1",
      "Color": "red",
      "id": 152
    }, {
      "Aliment": "Gelatin/Organs",
      "Food_Category": "Meat",
      "Alcide": "Very Low Acidic",
      "Score": "-1",
      "Color": "red",
      "id": 153
    }, {
      "Aliment": "Pumpkin Seed Oil",
      "Food_Category": "Nut",
      "Alcide": "Very Low Acidic",
      "Score": "-1",
      "Color": "red",
      "id": 154
    }, {
      "Aliment": "Canola Oil",
      "Food_Category": "Oil",
      "Alcide": "Very Low Acidic",
      "Score": "-1",
      "Color": "red",
      "id": 155
    }, {
      "Aliment": "Spinach Oil",
      "Food_Category": "Oil",
      "Alcide": "Very Low Acidic",
      "Score": "-1",
      "Color": "red",
      "id": 156
    }, {
      "Aliment": "Sunflower Oil",
      "Food_Category": "Oil",
      "Alcide": "Very Low Acidic",
      "Score": "-1",
      "Color": "red",
      "id": 157
    }, {
      "Aliment": "Pine Nut",
      "Food_Category": "Oil",
      "Alcide": "Very Low Acidic",
      "Score": "-1",
      "Color": "red",
      "id": 158
    }, {
      "Aliment": "MSG",
      "Food_Category": "Preservative",
      "Alcide": "Very Low Acidic",
      "Score": "-1",
      "Color": "red",
      "id": 159
    }, {
      "Aliment": "Cream/Butter",
      "Food_Category": "Processed Dairy",
      "Alcide": "Very Low Acidic",
      "Score": "-1",
      "Color": "red",
      "id": 160
    }, {
      "Aliment": "Zucchini",
      "Food_Category": "Pulse",
      "Alcide": "Very Low Acidic",
      "Score": "-1",
      "Color": "red",
      "id": 161
    }, {
      "Aliment": "Rhubarb",
      "Food_Category": "Root",
      "Alcide": "Very Low Acidic",
      "Score": "-1",
      "Color": "red",
      "id": 162
    }, {
      "Aliment": "Chutney",
      "Food_Category": "Root",
      "Alcide": "Very Low Acidic",
      "Score": "-1",
      "Color": "red",
      "id": 163
    }, {
      "Aliment": "Grape Seed Oil",
      "Food_Category": "Seed/Sprout",
      "Alcide": "Very Low Acidic",
      "Score": "-1",
      "Color": "red",
      "id": 164
    }, {
      "Aliment": "Curry",
      "Food_Category": "Spice/Herb",
      "Alcide": "Very Low Acidic",
      "Score": "-1",
      "Color": "red",
      "id": 165
    }, {
      "Aliment": "Honey/Maple Syrup",
      "Food_Category": "Sweetner",
      "Alcide": "Very Low Acidic",
      "Score": "-1",
      "Color": "red",
      "id": 166
    }, {
      "Aliment": "Black-eyed Pea",
      "Food_Category": "Vegetable",
      "Alcide": "Very Low Acidic",
      "Score": "-1",
      "Color": "red",
      "id": 167
    }, {
      "Aliment": "Kidney Bean",
      "Food_Category": "Vegetable",
      "Alcide": "Very Low Acidic",
      "Score": "-1",
      "Color": "red",
      "id": 168
    }, {
      "Aliment": "Rice Vinegar",
      "Food_Category": "Vinegar",
      "Alcide": "Very Low Acidic",
      "Score": "-1",
      "Color": "red",
      "id": 169
    }, {
      "Aliment": "Pinto Bean",
      "Food_Category": "Bean",
      "Alcide": "Low Acidic",
      "Score": "-2",
      "Color": "red",
      "id": 170
    }, {
      "Aliment": "Alcohol",
      "Food_Category": "Beverage",
      "Alcide": "Low Acidic",
      "Score": "-2",
      "Color": "red",
      "id": 171
    }, {
      "Aliment": "Black Tea",
      "Food_Category": "Beverage",
      "Alcide": "Low Acidic",
      "Score": "-2",
      "Color": "red",
      "id": 172
    }, {
      "Aliment": "Spelt/Teff/Kamut",
      "Food_Category": "Cereal",
      "Alcide": "Low Acidic",
      "Score": "-2",
      "Color": "red",
      "id": 173
    }, {
      "Aliment": "Plum",
      "Food_Category": "Fruits",
      "Alcide": "Low Acidic",
      "Score": "-2",
      "Color": "red",
      "id": 174
    }, {
      "Aliment": "Prune",
      "Food_Category": "Fruits",
      "Alcide": "Low Acidic",
      "Score": "-2",
      "Color": "red",
      "id": 175
    }, {
      "Aliment": "Tomato",
      "Food_Category": "Fruits",
      "Alcide": "Low Acidic",
      "Score": "-2",
      "Color": "red",
      "id": 176
    }, {
      "Aliment": "Aged Cheese",
      "Food_Category": "Cow/Human",
      "Alcide": "Low Acidic",
      "Score": "-2",
      "Color": "red",
      "id": 177
    }, {
      "Aliment": "Shell Fish/Mollusks",
      "Food_Category": "Fish/Shell Fish",
      "Alcide": "Low Acidic",
      "Score": "-2",
      "Color": "red",
      "id": 178
    }, {
      "Aliment": "Buckwheat",
      "Food_Category": "Fowl",
      "Alcide": "Low Acidic",
      "Score": "-2",
      "Color": "red",
      "id": 179
    }, {
      "Aliment": "Goose/Turkey",
      "Food_Category": "Fowl",
      "Alcide": "Low Acidic",
      "Score": "-2",
      "Color": "red",
      "id": 180
    }, {
      "Aliment": "Boar/Elk/·Game Meat",
      "Food_Category": "Game",
      "Alcide": "Low Acidic",
      "Score": "-2",
      "Color": "red",
      "id": 181
    }, {
      "Aliment": "Goat Milk",
      "Food_Category": "Goat/Sheep",
      "Alcide": "Low Acidic",
      "Score": "-2",
      "Color": "red",
      "id": 182
    }, {
      "Aliment": "Wheat",
      "Food_Category": "Grain",
      "Alcide": "Low Acidic",
      "Score": "-2",
      "Color": "red",
      "id": 183
    }, {
      "Aliment": "White Rice",
      "Food_Category": "Grass",
      "Alcide": "Low Acidic",
      "Score": "-2",
      "Color": "red",
      "id": 184
    }, {
      "Aliment": "Farina/Semolina",
      "Food_Category": "Grass",
      "Alcide": "Low Acidic",
      "Score": "-2",
      "Color": "red",
      "id": 185
    }, {
      "Aliment": "Aduki Bean",
      "Food_Category": "Legume",
      "Alcide": "Low Acidic",
      "Score": "-2",
      "Color": "red",
      "id": 186
    }, {
      "Aliment": "Lamb/Mutton",
      "Food_Category": "Meat",
      "Alcide": "Low Acidic",
      "Score": "-2",
      "Color": "red",
      "id": 187
    }, {
      "Aliment": "Almond Oil",
      "Food_Category": "Nut",
      "Alcide": "Low Acidic",
      "Score": "-2",
      "Color": "red",
      "id": 188
    }, {
      "Aliment": "Seitan or Tofu",
      "Food_Category": "Oil",
      "Alcide": "Low Acidic",
      "Score": "-2",
      "Color": "red",
      "id": 189
    }, {
      "Aliment": "Split Pea",
      "Food_Category": "Oil",
      "Alcide": "Low Acidic",
      "Score": "-2",
      "Color": "red",
      "id": 190
    }, {
      "Aliment": "Safflower Oil",
      "Food_Category": "Oil",
      "Alcide": "Low Acidic",
      "Score": "-2",
      "Color": "red",
      "id": 191
    }, {
      "Aliment": "Tapioca",
      "Food_Category": "Oil",
      "Alcide": "Low Acidic",
      "Score": "-2",
      "Color": "red",
      "id": 192
    }, {
      "Aliment": "Benzoate",
      "Food_Category": "Preservative",
      "Alcide": "Low Acidic",
      "Score": "-2",
      "Color": "red",
      "id": 193
    }, {
      "Aliment": "Cow Milk",
      "Food_Category": "Processed Dairy",
      "Alcide": "Low Acidic",
      "Score": "-2",
      "Color": "red",
      "id": 194
    }, {
      "Aliment": "Lima or Mung Bean",
      "Food_Category": "Pulse",
      "Alcide": "Low Acidic",
      "Score": "-2",
      "Color": "red",
      "id": 195
    }, {
      "Aliment": "Chard",
      "Food_Category": "Root",
      "Alcide": "Low Acidic",
      "Score": "-2",
      "Color": "red",
      "id": 196
    }, {
      "Aliment": "Sesame Oil",
      "Food_Category": "Seed/Sprout",
      "Alcide": "Low Acidic",
      "Score": "-2",
      "Color": "red",
      "id": 197
    }, {
      "Aliment": "Soy Cheese",
      "Food_Category": "Soy",
      "Alcide": "Low Acidic",
      "Score": "-2",
      "Color": "red",
      "id": 198
    }, {
      "Aliment": "Vanilla",
      "Food_Category": "Spice/Herb",
      "Alcide": "Low Acidic",
      "Score": "-2",
      "Color": "red",
      "id": 199
    }, {
      "Aliment": "Antihistamines",
      "Food_Category": "Therapeutic",
      "Alcide": "Low Acidic",
      "Score": "-2",
      "Color": "red",
      "id": 200
    }, {
      "Aliment": "Navy/Red Bean",
      "Food_Category": "Vegetable",
      "Alcide": "Low Acidic",
      "Score": "-2",
      "Color": "red",
      "id": 201
    }, {
      "Aliment": "White Bean",
      "Food_Category": "Vegetable",
      "Alcide": "Low Acidic",
      "Score": "-2",
      "Color": "red",
      "id": 202
    }, {
      "Aliment": "Balsamic Vinegar",
      "Food_Category": "Vinegar",
      "Alcide": "Low Acidic",
      "Score": "-2",
      "Color": "red",
      "id": 203
    }, {
      "Aliment": "Peanut",
      "Food_Category": "Bean",
      "Alcide": "Moderately Acidic",
      "Score": "-3",
      "Color": "red",
      "id": 204
    }, {
      "Aliment": "Coffee",
      "Food_Category": "Beverage",
      "Alcide": "Moderately Acidic",
      "Score": "-3",
      "Color": "red",
      "id": 205
    }, {
      "Aliment": "Corn",
      "Food_Category": "Cereal",
      "Alcide": "Moderately Acidic",
      "Score": "-3",
      "Color": "red",
      "id": 206
    }, {
      "Aliment": "Cranberry",
      "Food_Category": "Fruits",
      "Alcide": "Moderately Acidic",
      "Score": "-3",
      "Color": "red",
      "id": 207
    }, {
      "Aliment": "Pomegranate",
      "Food_Category": "Fruits",
      "Alcide": "Moderately Acidic",
      "Score": "-3",
      "Color": "red",
      "id": 208
    }, {
      "Aliment": "New Cheese",
      "Food_Category": "Cow/Human",
      "Alcide": "Moderately Acidic",
      "Score": "-3",
      "Color": "red",
      "id": 209
    }, {
      "Aliment": "Mussel/Squid",
      "Food_Category": "Fish/Shell Fish",
      "Alcide": "Moderately Acidic",
      "Score": "-3",
      "Color": "red",
      "id": 210
    }, {
      "Aliment": "Maize",
      "Food_Category": "Fowl",
      "Alcide": "Moderately Acidic",
      "Score": "-3",
      "Color": "red",
      "id": 211
    }, {
      "Aliment": "Chicken",
      "Food_Category": "Fowl",
      "Alcide": "Moderately Acidic",
      "Score": "-3",
      "Color": "red",
      "id": 212
    }, {
      "Aliment": "Bear",
      "Food_Category": "Game",
      "Alcide": "Moderately Acidic",
      "Score": "-3",
      "Color": "red",
      "id": 213
    }, {
      "Aliment": "Barley Groat",
      "Food_Category": "Grain",
      "Alcide": "Moderately Acidic",
      "Score": "-3",
      "Color": "red",
      "id": 214
    }, {
      "Aliment": "Oat Bran",
      "Food_Category": "Grass",
      "Alcide": "Moderately Acidic",
      "Score": "-3",
      "Color": "red",
      "id": 215
    }, {
      "Aliment": "Rye",
      "Food_Category": "Grass",
      "Alcide": "Moderately Acidic",
      "Score": "-3",
      "Color": "red",
      "id": 216
    }, {
      "Aliment": "Legumes (other)",
      "Food_Category": "Legume",
      "Alcide": "Moderately Acidic",
      "Score": "-3",
      "Color": "red",
      "id": 217
    }, {
      "Aliment": "Pork/Veal",
      "Food_Category": "Meat",
      "Alcide": "Moderately Acidic",
      "Score": "-3",
      "Color": "red",
      "id": 218
    }, {
      "Aliment": "Pistachio Seed",
      "Food_Category": "Nut",
      "Alcide": "Moderately Acidic",
      "Score": "-3",
      "Color": "red",
      "id": 219
    }, {
      "Aliment": "Palm Kernel Oil",
      "Food_Category": "Oil",
      "Alcide": "Moderately Acidic",
      "Score": "-3",
      "Color": "red",
      "id": 220
    }, {
      "Aliment": "Green Pea",
      "Food_Category": "Oil",
      "Alcide": "Moderately Acidic",
      "Score": "-3",
      "Color": "red",
      "id": 221
    }, {
      "Aliment": "Lard",
      "Food_Category": "Oil",
      "Alcide": "Moderately Acidic",
      "Score": "-3",
      "Color": "red",
      "id": 222
    }, {
      "Aliment": "Pecan",
      "Food_Category": "Oil",
      "Alcide": "Moderately Acidic",
      "Score": "-3",
      "Color": "red",
      "id": 223
    }, {
      "Aliment": "Aspartame",
      "Food_Category": "Preservative",
      "Alcide": "Moderately Acidic",
      "Score": "-3",
      "Color": "red",
      "id": 224
    }, {
      "Aliment": "Casein, Milk Protein,Cottage Cheese",
      "Food_Category": "Processed Dairy",
      "Alcide": "Moderately Acidic",
      "Score": "-3",
      "Color": "red",
      "id": 225
    }, {
      "Aliment": "Chick Pea/Garbanzo",
      "Food_Category": "Root",
      "Alcide": "Moderately Acidic",
      "Score": "-3",
      "Color": "red",
      "id": 226
    }, {
      "Aliment": "Chestnut Oil",
      "Food_Category": "Seed/Sprout",
      "Alcide": "Moderately Acidic",
      "Score": "-3",
      "Color": "red",
      "id": 227
    }, {
      "Aliment": "Soy Milk",
      "Food_Category": "Soy",
      "Alcide": "Moderately Acidic",
      "Score": "-3",
      "Color": "red",
      "id": 228
    }, {
      "Aliment": "Nutmeg",
      "Food_Category": "Spice/Herb",
      "Alcide": "Moderately Acidic",
      "Score": "-3",
      "Color": "red",
      "id": 229
    }, {
      "Aliment": "Saccharin",
      "Food_Category": "Sweetner",
      "Alcide": "Moderately Acidic",
      "Score": "-3",
      "Color": "red",
      "id": 230
    }, {
      "Aliment": "Snow Pea",
      "Food_Category": "Vegetable",
      "Alcide": "Moderately Acidic",
      "Score": "-3",
      "Color": "red",
      "id": 231
    }, {
      "Aliment": "Red Wine Vinegar",
      "Food_Category": "Vinegar",
      "Alcide": "Moderately Acidic",
      "Score": "-3",
      "Color": "red",
      "id": 232
    }, {
      "Aliment": "Carob",
      "Food_Category": "Bean",
      "Alcide": "Highly Acidic",
      "Score": "-4",
      "Color": "red",
      "id": 233
    }, {
      "Aliment": "Beer, Soda",
      "Food_Category": "Beverage",
      "Alcide": "Highly Acidic",
      "Score": "-4",
      "Color": "red",
      "id": 234
    }, {
      "Aliment": "Yeast/Hops/Malt",
      "Food_Category": "Beverage",
      "Alcide": "Highly Acidic",
      "Score": "-4",
      "Color": "red",
      "id": 235
    }, {
      "Aliment": "Ice Cream",
      "Food_Category": "Cow/Human",
      "Alcide": "Highly Acidic",
      "Score": "-4",
      "Color": "red",
      "id": 236
    }, {
      "Aliment": "Lobster",
      "Food_Category": "Fish/Shell Fish",
      "Alcide": "Highly Acidic",
      "Score": "-4",
      "Color": "red",
      "id": 237
    }, {
      "Aliment": "Barley",
      "Food_Category": "Fowl",
      "Alcide": "Highly Acidic",
      "Score": "-4",
      "Color": "red",
      "id": 238
    }, {
      "Aliment": "Pheasant",
      "Food_Category": "Fowl",
      "Alcide": "Highly Acidic",
      "Score": "-4",
      "Color": "red",
      "id": 239
    }, {
      "Aliment": "Processed Flour",
      "Food_Category": "Grain",
      "Alcide": "Highly Acidic",
      "Score": "-4",
      "Color": "red",
      "id": 240
    }, {
      "Aliment": "Beef",
      "Food_Category": "Meat",
      "Alcide": "Highly Acidic",
      "Score": "-4",
      "Color": "red",
      "id": 241
    }, {
      "Aliment": "Cottonseed Oil/Meal",
      "Food_Category": "Nut",
      "Alcide": "Highly Acidic",
      "Score": "-4",
      "Color": "red",
      "id": 242
    }, {
      "Aliment": "Fried Food",
      "Food_Category": "Oil",
      "Alcide": "Highly Acidic",
      "Score": "-4",
      "Color": "red",
      "id": 243
    }, {
      "Aliment": "Soybean",
      "Food_Category": "Oil",
      "Alcide": "Highly Acidic",
      "Score": "-4",
      "Color": "red",
      "id": 244
    }, {
      "Aliment": "Walnut",
      "Food_Category": "Oil",
      "Alcide": "Highly Acidic",
      "Score": "-4",
      "Color": "red",
      "id": 245
    }, {
      "Aliment": "Brazil Nut",
      "Food_Category": "Oil",
      "Alcide": "Highly Acidic",
      "Score": "-4",
      "Color": "red",
      "id": 246
    }, {
      "Aliment": "Table Salt (NaCL)",
      "Food_Category": "Preservative",
      "Alcide": "Highly Acidic",
      "Score": "-4",
      "Color": "red",
      "id": 247
    }, {
      "Aliment": "Processed Cheese",
      "Food_Category": "Processed Dairy",
      "Alcide": "Highly Acidic",
      "Score": "-4",
      "Color": "red",
      "id": 248
    }, {
      "Aliment": "Hazelnut",
      "Food_Category": "Seed/Sprout",
      "Alcide": "Highly Acidic",
      "Score": "-4",
      "Color": "red",
      "id": 249
    }, {
      "Aliment": "Pudding/Jam/Jelly",
      "Food_Category": "Spice/Herb",
      "Alcide": "Highly Acidic",
      "Score": "-4",
      "Color": "red",
      "id": 250
    }, {
      "Aliment": "Sugar/Cocoa",
      "Food_Category": "Sweetner",
      "Alcide": "Highly Acidic",
      "Score": "-4",
      "Color": "red",
      "id": 251
    }, {
      "Aliment": "Antibiotics",
      "Food_Category": "Therapeutic",
      "Alcide": "Highly Acidic",
      "Score": "-4",
      "Color": "red",
      "id": 252
    }, {
      "Aliment": "White/Acetic Vinegar",
      "Food_Category": "Vinegar",
      "Alcide": "Highly Acidic",
      "Score": "-4",
      "Color": "red",
      "id": 253
    }];
    ////////////////////////
    $scope.selected = "Food_Category";

    /////////////////////////////////

  })
  .directive('inputClear', inputClear)
  .directive('inputClearNoMaterial', inputClearNoMaterial);

// function AppCtrl($scope) {
//   $scope.value = '';
// }

function inputClear() {
  return {
    restrict: 'A',
    compile: function(element, attrs) {
      var color = attrs.inputClear;
      var style = color ? "color:" + color + ";" : "";
      var action = attrs.ngModel + " = ''";
      element.after(
        '<md-button class="animate-show md-icon-button md-accent"' +
        'ng-show="' + attrs.ngModel + '" ng-click="' + action + '"' +
        'style="position: absolute; top: 0px; right: -6px; margin: 0;">' +
        '<div style="' + style + '">x</div>' +
        '</md-button>');
    }
  };
}

function inputClearNoMaterial() {
  return {
    restrict: 'A',
    compile: function(element, attrs) {
      var color = attrs.inputClearNoMaterial;
      var style = color ? "color:" + color + ";" : "";
      var action = attrs.ngModel + " = ''";
      element.after(
        '<span class="animate-show"' +
        'ng-show="' + attrs.ngModel + '" ng-click="' + action + '"' +
        'style="position: absolute; margin: 3px -20px; cursor: pointer;">' +
        '<div style="' + style + '">x</div>' +
        '</span>');
    }
  };
}

              
            
!
999px

Console