Cart system with angular js

------------------------------------------
Cntrl.cs
------------------------------------------
public class CartController : Controller
    {
        DemoEntities context = new DemoEntities();
        // GET: Cart
        public ActionResult Index()
        {
            ViewBag.Productlist = context.ProductMasters.ToList();
            return View();
        }
        public ActionResult CartView()
        {
            return View();
        }
    }
------------------------------------------
srvc.js
------------------------------------------
(function () {
    angular.module("myapp").service("CartService", ["$http", function ($http) {

        var listing = [];
        listing.GetAllProduct = function () {
            return $http({
                method: "Post",
                url: "",
                data: "",
            })
        }
    }])
})();
------------------------------------------
Cntrl.js
------------------------------------------
(function () {
    angular.module("myapp", []).controller("CartCntrl", ["$scope", "$http", "CartService", function CartCntrl($scope, $http, CartService) {
        $scope.cartlist = JSON.parse(localStorage.getItem("Cart")) == null ? [] : JSON.parse(localStorage.getItem("Cart"));
        $scope.cartviewlist = [];
        $scope.price = 0;
        $scope.counting = 0
        $scope.GetProduct = function (data) {
            $scope.Productlist = angular.copy(data);
            $.each($scope.cartlist, function (index, value) {
                $scope.price += parseInt(value.Price);
                $scope.counting += parseInt(value.Quantity);
            })
        }

        $scope.AddCart = function (data) {
            var Cart = [];
            if (localStorage.length > 0) {
                $scope.cartlist = JSON.parse(localStorage.getItem("Cart"));
            }
            if ($scope.counting != data.Quantity) {
                $scope.cartlist.push({
                    ProductName: data.ProductName,
                    ProductImage: data.ProductImage,
                    ProductDesc: data.ProductDesc,
                    Price: data.Price,
                    Quantity: 1,
                    OrignalPrice: data.Price,
                    OrignalQuantity: data.Quantity
                });
                $scope.price += parseInt(data.Price);
                $scope.counting++;
                $scope.priceing = $scope.price;
                $scope.counteing = $scope.counting;
                localStorage.setItem("Cart", JSON.stringify($scope.cartlist))
            } else {
                alert("Maximum " + data.Quantity + " Allowed.");
            }
        }
        function counttotal() {
            $scope.priceing = 0;
            $scope.counteing = 0;
            $.each($scope.cartviewlist, function (index, value) {
                $scope.priceing += parseInt(value.Price);
                $scope.counteing += parseInt(value.Quantity);
            })
        }
        $scope.ViewCartData = function () {
            $scope.cartlist = JSON.parse(localStorage.getItem("Cart"));
            var isDuplicate = false;
            $.each($scope.cartlist, function (index, value) {
                var data = jQuery.grep($scope.cartviewlist, function (val, cartindex) {
                    if (val.ProductName == value.ProductName) {
                        $scope.cartviewlist[cartindex].Quantity += 1;
                        $scope.cartviewlist[cartindex].Price += value.Price;
                    }
                    return val.ProductName == value.ProductName
                });
                if (data.length <= 0) {
                    $scope.cartviewlist.push(value);
                }
                counttotal();
            });
        }
     
        //$scope.ViewCartData();
        $scope.removeitem = function (index) {
            $scope.cartviewlist[index].Quantity = $scope.cartviewlist[index].Quantity - 1;
            $scope.cartviewlist[index].Price = $scope.cartviewlist[index].Price - $scope.cartviewlist[index].OrignalPrice;
            localStorage.setItem("Cart", JSON.stringify($scope.cartviewlist));
            counttotal();
         
            //$scope.cartviewlist[index].Price = $scope.cartviewlist[index].Quantity - 1;
        }
        $scope.additem = function (index) {
                $scope.cartviewlist[index].Quantity = $scope.cartviewlist[index].Quantity + 1;
                $scope.cartviewlist[index].Price = $scope.cartviewlist[index].Price + $scope.cartviewlist[index].OrignalPrice;
                localStorage.setItem("Cart", JSON.stringify($scope.cartviewlist));
                counttotal();

            //$scope.cartviewlist[index].Price = $scope.cartviewlist[index].Quantity - 1;
        }
        $scope.Remove = function (index) {
            $scope.cartviewlist.splice(index, 1);
            localStorage.setItem("Cart", JSON.stringify($scope.cartviewlist));
            counttotal();
        }
     
    }])
})();
------------------------------------------
Index.cshtml
------------------------------------------

@{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/_Layout.cshtml";
}
<br /><br />
<div data-ng-controller="CartCntrl">
    <div data-ng-init="GetProduct(@Json.Encode(ViewBag.Productlist))">
        <table class="table table-bordered">
            <thead>
                <tr>
                    <th>
                        Sr.
                    </th>
                    <th>
                        Image
                    </th>
                    <th>
                        ProductName
                    </th>
                    <th>
                        ProductDesc
                    </th>
                    <th>
                        Price
                    </th>
                    <th>
                        Quantity
                    </th>
                    <th>
                        <a href="/Cart/CartView"><b>{{counting}} items, Rs.{{price}}</b></a>
                    </th>
                </tr>
            </thead>
            <tbody>
                <tr ng-repeat="item in Productlist" ng-if="Productlist.length >0">
                    <td>
                        {{$index+1}}
                    </td>
                    <td>
                        <img src="~/Content/Img/{{item.ProductImage}}" />
                    </td>
                    <td>
                        {{item.ProductName}}
                    </td>
                    <td>
                        {{item.ProductDesc}}
                    </td>
                    <td>
                        {{item.Price}}
                    </td>
                    <td>
                        {{item.Quantity}}
                    </td>
                    <td>
                        <a href="#" ng-click="AddCart(item)">Add To Cart</a>
                    </td>
                </tr>
                <tr ng-if="Productlist.length <= 0" class="text-danger">
                    <td colspan="8"> <span class="text-danger text-center"> Record not found.</span> </td>
                </tr>
            </tbody>
        </table>
    </div>
</div>
@section Scripts{
    <script src="~/Scripts/Controller/CartCntrl.js"></script>
    <script src="~/Scripts/Services/CartService.js"></script>
    @*<script>
        $(window).load(function () {
            localStorage.removeItem("Cart");
        })
    </script>*@
}
------------------------------------------
cartview.cshtml
------------------------------------------

@{
    ViewBag.Title = "CartView";
    Layout = "~/Views/Shared/_Layout.cshtml";
}
<br /><br />
<div ng-controller="CartCntrl">
    <div ng-init="ViewCartData()">
        <div>
            <a href="/Cart/Index" class="btn btn-primary">Back</a>
        </div>
        <br />
        <table class="table table-bordered">
            <thead>
                <tr>
                    <th>
                        Sr.
                    </th>
                    <th>
                        ProductName
                    </th>
                    <th>
                        Price
                    </th>
                    <th>
                        Quantity
                    </th>
                    <th>
                    </th>
                </tr>
            </thead>
            <tbody>
                <tr ng-repeat="item in cartviewlist" ng-if="cartviewlist.length >0">
                    <td>
                        {{$index+1}}
                    </td>
                    <td>
                        {{item.ProductName}}
                    </td>
                    <td>
                         Rs.{{item.Price}}
                    </td>
                    <td>
                        {{item.Quantity}} <a ng-if="item.Quantity<item.OrignalQuantity" class="btn btn-default" ng-click="additem($index)">+</a><a class="btn btn-default" ng-if="item.Quantity>1" ng-click="removeitem($index)">-</a>
                    </td>
                    <td>
                        <a href="#" ng-click="Remove($index)">X</a>
                    </td>
                </tr><tr>
                         <td>
                         </td>
                         <td>
                         </td>
                         <td>
                            Rs.{{priceing}}
                         </td>
                         <td>
                             {{counteing}}
                         </td>
                </tr>
                <tr ng-if="cartviewlist.length <= 0" class="text-danger">
                    <td colspan="8"> <span class="text-danger text-center"> Record not found.</span> </td>
                </tr>
            </tbody>
        </table>
    </div>
</div>
@section Scripts{
    <script src="~/Scripts/Controller/CartCntrl.js"></script>
    <script src="~/Scripts/Services/CartService.js"></script>
}
------------------------------------------
table
------------------------------------------
ProductId int Unchecked
ProductName varchar(50) Unchecked
ProductDesc nvarchar(200) Checked
ProductImage nvarchar(50) Checked
Price decimal(18, 2) Unchecked
Quantity int Unchecked