suissa/ex09-angularjs-workshop-be-mean

## ex09-angularjs-workshop-be-mean
<!doctype html>
<html data-ng-app="workshopBeMEAN">
  <title>{{ workshop }}</title>
  <body>

    <div data-ng-controller='BeerController'>
    <!-- Exibição do array de cervejas setado no BeerController -->
      {{ cervejas }}

      <pre>Sorting predicate = {{predicate}}; reverse = {{reverse}}</pre>

      <a href="" data-ng-click="predicate = 'name'; reverse=!reverse">Nome</a>

      <p>
        <button data-ng-click='ordenar()'>Ordenar</button>
      </p>

      <!-- Listamos as cervejas do nosso escopo a diretiva ng-repeat -->


      <ul>
        <!-- instanciamos o valor de cada cerveja em beer -->
        <li data-ng-repeat='beer in cervejas | orderBy: predicate:reverse'>
          <!-- recuperamos os valores de name e price de cada cerveja -->
          {{ beer.name }} - {{ beer.price }}
        </li>
      </ul>
    </div>

    <script src="angular.min.js"></script>
    <script>
      angular.module('workshopBeMEAN', ['workshopFilters', 'workshopControllers']);

      angular.module('workshopControllers', [])
      .controller('BeerController', ['$scope',
        function($scope){
          $scope.reverse = true;
          $scope.predicate = 'name';

          $scope.ordenar = function(){
            $scope.reverse = true;
            $scope.predicate = 'price';
          }

          $scope.cervejas = [{
            name: 'Kaiser', price: 2
            }, {
              name: 'Skol', price: 3
            }, {
              name: 'Glacial', price: 4
            }, {
              name: 'Polar', price: 6
            }, {
              name: 'Heineken', price: 10
            }
          ];
      }]);

      angular.module('workshopFilters', [])
        .filter('reverseName', function () {
          return function (text) {
            if(text)
              return text.split("").reverse().join("");
          };
        })
        .filter('truncate', function () {
          return function (text, length, end) {
            if (isNaN(length))
                length = 10;
            if (end === undefined)
                end = "...";
            if (text.length <= length || text.length - end.length <= length) {
                return text;
            }
            else {
                return String(text).substring(0, length-end.length) + end;
            }
          };
      });
    </script>
  </body>
</html>
	<!doctype html>
	<html data-ng-app="workshopBeMEAN">
	<title>{{ workshop }}</title>
	<body>

	<div data-ng-controller='BeerController'>
	<!-- Exibição do array de cervejas setado no BeerController -->
	{{ cervejas }}

	<pre>Sorting predicate = {{predicate}}; reverse = {{reverse}}</pre>

	<a href="" data-ng-click="predicate = 'name'; reverse=!reverse">Nome</a>

	<p>
	<button data-ng-click='ordenar()'>Ordenar</button>
	</p>

	<!-- Listamos as cervejas do nosso escopo a diretiva ng-repeat -->


	<ul>
	<!-- instanciamos o valor de cada cerveja em beer -->
	<li data-ng-repeat='beer in cervejas \| orderBy: predicate:reverse'>
	<!-- recuperamos os valores de name e price de cada cerveja -->
	{{ beer.name }} - {{ beer.price }}
	</li>
	</ul>
	</div>

	<script src="angular.min.js"></script>
	<script>
	angular.module('workshopBeMEAN', ['workshopFilters', 'workshopControllers']);

	angular.module('workshopControllers', [])
	.controller('BeerController', ['$scope',
	function($scope){
	$scope.reverse = true;
	$scope.predicate = 'name';

	$scope.ordenar = function(){
	$scope.reverse = true;
	$scope.predicate = 'price';
	}

	$scope.cervejas = [{
	name: 'Kaiser', price: 2
	}, {
	name: 'Skol', price: 3
	}, {
	name: 'Glacial', price: 4
	}, {
	name: 'Polar', price: 6
	}, {
	name: 'Heineken', price: 10
	}
	];
	}]);

	angular.module('workshopFilters', [])
	.filter('reverseName', function () {
	return function (text) {
	if(text)
	return text.split("").reverse().join("");
	};
	})
	.filter('truncate', function () {
	return function (text, length, end) {
	if (isNaN(length))
	length = 10;
	if (end === undefined)
	end = "...";
	if (text.length <= length \|\| text.length - end.length <= length) {
	return text;
	}
	else {
	return String(text).substring(0, length-end.length) + end;
	}
	};
	});
	</script>
	</body>
	</html>