Angular: Empty Fiddle

http://angularjs.org/

by Pratik Bhattachary

HTML

<script src="http://code.angularjs.org/angular-1.0.1.js"></script>
<div ng-controller="MyCtrl">
  <table>
    <tr>
      <td><strong>Data</strong></td>
      <td><strong>tempmin</strong></td>
      <td><strong>tempmax</strong></td>
      <td><strong>umiditatea</strong></td>
      <td><strong>presiunea</strong></td>
      <td><strong>vitezavint</strong></td>
      <td><strong>nori</strong></td>
    </tr>
    <tr ng-repeat="md in chisinau.list">
      <td class='td'><span ng-show='butoane[0].show'>
    {{md.dt * 1000 | date:"MM.dd"}}</span></td>
      <td class='td'><span ng-show='butoane[1].show'>
    {{md.temp.min}}</span></td>
      <td class='td'><span ng-show='butoane[2].show'>
    {{md.temp.max}}</span></td>
      <td class='td'><span ng-show='butoane[3].show'>
    {{md.humidity}}%</span></td>
      <td class='td'><span ng-show='butoane[4].show'>
    {{md.pressure}}</span></td>
      <td class='td'><span ng-show='butoane[5].show'>
    {{md.speed}}</span></td>
      <td class='td'><span ng-show='butoane[6].show'>
    {{md.clouds}}</span></td>
    </tr>
    <tr>
      <td ng-repeat='buton in butoane'>
        <button ng-click="fbuton(buton)">{{buton.label}}</button>
      </td>
    </tr>
  </table>
</div>

JavaScript

var myApp = angular.module('myApp', []);

//myApp.directive('myDirective', function() {});
//myApp.factory('myService', function() {});

myApp.factory("data", function($q) {
  return {
    get: function() {
      var defer = $q.defer();
      var items = {
        list: [{
          dt: 0.0042,
          temp: {
            min: 9.78,
            max: 19.86
          },
          humidity: 59,
          pressure: 1012.3,
          speed: 5.93,
          clouds: 0
        }]
      };
      defer.resolve(items)
      return defer.promise;
    }
  }
});

function MyCtrl($scope, data) {
  data.get()
    .then(function(response) {
      $scope.chisinau = response;
    });

  $scope.butoane = [{
    label: 'buton - data ',
    show: true
  }, {
    label: 'buton - tempmin ',
    show: true
  }, {
    label: 'buton - tempmax ',
    show: true
  }, {
    label: 'buton - umidiatea ',
    show: true
  }, {
    label: 'buton - presiunea ',
    show: true
  }, {
    label: 'buton - vitezavint ',
    show: true
  }, {
    label: 'buton - nori ',
    show: true
  }];
	
  $scope.fbuton = function(x) {
    x.show = !x.show;
  }
}