Question

我正在购买AngularJs的购物车，但我在向购物车添加产品时遇到了麻烦。我认为错误在我的控制器上：

我的data.json：

BOOL GetTrueWindowsVersion(OSVERSIONINFOEX* pOSversion)
{
   // Function pointer to driver function
   NTSTATUS (WINAPI *pRtlGetVersion)(
      PRTL_OSVERSIONINFOW lpVersionInformation) = NULL;

   // load the System-DLL
   HINSTANCE hNTdllDll = LoadLibrary("ntdll.dll");

   // successfully loaded?
   if (hNTdllDll != NULL)
   {
      // get the function pointer to RtlGetVersion
      pRtlGetVersion = (NTSTATUS (WINAPI *)(PRTL_OSVERSIONINFOW))
            GetProcAddress (hNTdllDll, "RtlGetVersion");

      // if successfull then read the function
      if (pRtlGetVersion != NULL)
         pRtlGetVersion((PRTL_OSVERSIONINFOW)pOSversion);

      // free the library
      FreeLibrary(hNTdllDll);
   } // if (hNTdllDll != NULL)

   // if function failed, use fallback to old version
   if (pRtlGetVersion == NULL)
      GetVersionEx((OSVERSIONINFO*)pOSversion);

   // always true ...
   return (TRUE);
} // GetTrueWindowsVersion

我的controller.js：

{
"items": [
    {
        "product": {
            "name": "Smartphone",
            "price": {
                "value": 3509.10,
            }
        }
    },

    {
        "product": {

            "name": "Lenovo ",
            "price": {
                "value": 2599.00,

            }
        }
    }
]
}

我的HTML：

var app = angular.module("list", []);
app.controller("ListCtrl", ["$scope", "$http",
 function($scope, $http) {
 $scope.products = [];
 $http({
   method: 'GET',
   url: 'data.json'
 }).success(function(data) {
    angular.forEach(data.items, function(item, index) {
    $scope.products.push(item.product);
   });
 });
 }
 $scope.carts=[];
 $scope.add_cart = function(product){
  if(product){
    $scope.carts.push({ p_name: product.name, p_valor:product.price.value,);
  } 
}


$scope.total = 0;

$scope.setTotals = function(cart){
  if(cart){
    $scope.total += cart.p_valor;
  }
}

$scope.remove_cart = function(cart){
  if(cart){
    $scope.carts.splice($scope.carts.indexOf(cart), 1);
    $scope.total -= cart.p_valor;
  }
}
]);

我需要按钮添加到购物车才能正常工作，带来产品名称和产品价值。我还需要它来带来总价值，并且还需要在点击按钮删除购物车时删除产品。

Ty for Help guys！

Answer 1

您的controller.js文件包含一些语法错误。在将代码丢入stackoverflow的篮子之前，请检查代码中的任何拼写错误或语法错误。
反正，有些事情你需要记住代码。

在javascript中推荐camelCase。的 as per conventions

每个职能部门应专门执行特定任务（个人意见）

最好关注styleguide angularjs＆amp; javascript

$scope，$watch用于数据绑定，因此您可以在模板或其他范围（如指令）中使用数据。数据绑定是AngularJs的主要卖点，但它有一些drawbacks。

和权力带来了很大的责任。：眨眼

请看一下，这是您的代码的实时演示。

var app = angular.module("list", []); ListController.$inject = ["$scope", "$http"]; app.controller("ListCtrl", ListController); function ListController($scope, $http) { function onLoad() { $scope.products = []; $scope.carts = []; $scope.total = 0; // getProducts(); demoData(); } onLoad(); $scope.addCart = addCart; $scope.getTotals = getTotals; $scope.removeCart = removeCart; // hould remove when using in prod function demoData() { var data = { "items": [{ "product": { "name": "Smartphone", "price": { "value": 3509.10, } } }, { "product": { "name": "Lenovo ", "price": { "value": 2599.00, } } }] } parseProducts(data.items); } function getProducts() { $http.get('data.json') .success(function(data) { parseProducts(data.items) }) } function parseProducts(items) { angular.forEach(items, function(item, index) { $scope.products.push(item.product); }); } function addCart(product){ if(product){ $scope.carts.push({ p_name: product.name, p_price:product.price.value }); } } function getTotals(){ var initialValue = 0; $scope.total = $scope.carts.reduce((x,y) => x + y["p_price"], initialValue); } function removeCart(i){ $scope.carts.splice(i, 1); getTotals(); } }

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <body ng-app="list" ng-controller="ListCtrl"> <ul ng-repeat="product in products"> <li>{{product.name}} </li> <li>{{product.price.value}}</li> <li><button type = "button" ng-click = "addCart(product)"> Add to cart</button></li> </ul><br> <ul ng-repeat="cart in carts track by $index" ng-init = "getTotals(cart)"> <li>{{cart.p_name}}</li> <li>{{cart.p_price}}</li> <li><button type = "button" ng-click = "removeCart($index)">X</button> </li> </ul> <ul> <li>{{total}}</li> </ul> <button ng-click="getTotals()">get totals</button> </body>

Answer 2

我发现了一些语法错误

var app = angular.module("list", []);
app.controller("ListCtrl", ["$scope", "$http",
  function ($scope, $http) {
    $scope.products = [];
    $http({
      method: 'GET',
      url: 'data.json'
    }).success(function (data) {
      angular.forEach(data.items, function (item, index) {
        $scope.products.push(item.product);
      });
    });
    $scope.carts = [];
    $scope.add_cart = function (product) {
      if (product) { 
        $scope.carts.push({
          p_name: product.name,
          p_valor: product.price.value,
        }); //Here syntax err
      }
    }

    $scope.total = 0;

    $scope.setTotals = function (cart) {
    if (cart) {
      $scope.total += cart.p_valor;
    }
  }

  $scope.remove_cart = function (cart) {
            if (cart) {
                $scope.carts.splice($scope.carts.indexOf(cart), 1);
                $scope.total -= cart.p_valor;
            }
        }
    }  //Here syntax err
]);

购物车应用程序使用AngularJs控制器

2 个答案: