AngularJS Example: Carrito Compra Detalle

HTML

<div data-ng-app="MiCarrito">
    <h1>Tienda de Todo</h1>
    <div ng-view=""></div>


  <script type="text/ng-template" id="lista.html">
     <h3>Productos</h3>
      <a href="#/carrito">Carrito</a>
      <div class="well span3" ng-repeat="producto in productos">
          <a href="#/detalle/{{producto.Id}}">
              <h4>{{producto.Producto}}</h4>
          </a>
          <img class="" title="{{producto.Producto}}" 
          src="{{producto.Imagen}}" />
          <button class="btn btn-info btn-block" ng-click="agregar(producto)"> 
              <i class="icon-plus-sign"></i>
              Precio: {{producto.Precio|formatoMoneda}}
          </button>
      </div>
  </script>

  <script type="text/ng-template" id="carrito.html">
      <h3>Carrito</h3>
        <a href="#/productos">Productos</a>
      <table class="table table-striped">
          <thead>
              <tr>
                  <th class="span1">Id</th>
                  <th class="span5">Producto</th>
                  <th class="span2">Cantidad</th>
                  <th class="span2">Precio</th>
                  <th class="span2">Total</th>
                  <td></td>
              </tr>
          </thead>
          <tbody>
              <tr class="well" ng-repeat="item in carrito">
                  <td>{{item.Producto.Id}}</td>
                  <td>{{item.Producto.Producto}}</td>
                  <td>
                      <input type="text" ng-model="item.Cantidad" />
                  </td>
                  <td>{{item.Producto.Precio|formatoMoneda}}</td>
                  <td>{{item.Cantidad * item.Producto.Precio|formatoMoneda}}</td>
                  <td>
                      <button class="btn btn-danger" ng-click="eliminar(item)">
                          <i class="icon-minus-sign"></i>
                      </button>
                  </td>
              </tr>
              <tr class="well">
                  <td></td>
                  <td></td>
                 ...

CSS

</style> <!-- Ugly Hack due to jsFiddle issue: http://goo.gl/BUfGZ --> <link rel="stylesheet" href="http://angularjs.org/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script> <style>
html img{ width: 200px; height: 150px; }

JavaScript

var miCarrito = angular.module("MiCarrito", []);

miCarrito.controller(
    'DetalleController',
    function($scope, $routeParams, ProductosService) {
        $scope.nuevoID = $routeParams.productoId;
        $scope.producto = ProductosService.filtrar($routeParams.productoId);
    });
miCarrito.controller(
    'ProductosController', 
    ['$scope','ProductosService', 'CarritoService',
function ($scope, prodService, carService) {
    $scope.titulo = "Tienda De Todo";
    $scope.productos = [];
    
    $scope.agregar = function (p) {
        carService.agregar(p);
    }
    
    $scope.formatoMoneda = function(valor){
        var valor = parseFloat(valor);
        return "S/." + Math.floor(valor) + "." + (valor * 100) % 100;
    }
    
    prodService.listar(function(data){
        $scope.productos = data;
        $scope.$apply();
    });
}]);


miCarrito.controller(
    'CarritoController', ['$scope', 'CarritoService',

function ($scope, carService) {
    $scope.carrito = [];
    
    carService.listar(function(data){
        $scope.carrito = data;
    });
    
    /*carService.carrito = $scope.carrito;*/
    
    $scope.precioTotal = function(){
        var total = 0;
        angular.forEach($scope.carrito, function(item){
            total = total + (item.Cantidad * item.Producto.Precio);
        });
        
        return total;
    };
    
    $scope.eliminar = function(item){
        carService.eliminar(item);
    };
    
}]);

miCarrito.filter('formatoMoneda', function() {
    return function(input) {
      var out = "";
      var valor = parseFloat(input);
      out = "S/." + Math.floor(valor) + "." + ((valor * 100) % 100 + '00').substr(0,2);
      return out;
    }
  });

miCarrito.factory('CarritoService', ['$http', function($http){
    var servicio = {};
    
    servicio.carrito = [];
    
    var filtrar = function(id){
        for (var i = 0; i < servicio.carrito.length; i++) {
            if (servicio.carrito[i].Producto.Id == id) {
              ...