AngularJS未在动态表中更新总计

时间:2014-09-23 15:15:19

标签: angularjs dynamic

我想在我的桌子上添加一个项目时总计所有的价格和数量。我不能让总数刷新。有人可以在我的代码中看到错误吗?

$scope.updateTotals = [];
function ExampleCtrl ($scope){
    $scope.people = [
        {number: '1', title: 'Tom Sawyer', author: 'Mark Twain', price: '28', quantity: '2', action: 'xx'},
        {number: '2', title: 'Alice\'s Adventure in Wonderland', author: 'Lewis Carroll', price: '17.00', quantity: '2', action: 'xx'},
        {number: '3', title: 'The Old Man and the Sea', author: 'Ernest Hemingway', price: '17', quantity: '1', action: 'xx'}

    ];


$scope.addPerson = function (){
    var person = {
        number: $scope.number,
        title: $scope.title,
        author: $scope.author,
        price: $scope.price,
        quantity: $scope.quantity,
        action: $scope.action

    };

    $scope.people.push( person );
};

$scope.removePerson = function (index){
    $scope.people.splice( index, 1 );


};

$scope.totPrice = function (){
    var totPrice = 0;
    var values = [$scope.people]
    angular.forEach(values, function(price, quantity) {
        totPrice += (price * quantity)
    });
    return totPrice;
};
$scope.totQty = function (){
    var totQty = 0;
    angular.forEach(
        $scope.people.quantity, function (quantity){
            totQty += (
                $scope.people.quantity * $scope.people.title
                );
            return totQty; }
    );



};


}

2 个答案:

答案 0 :(得分:0)

scope.updateTotals = [];
function ExampleCtrl ($scope){
    $scope.people = [
        {number: '1', title: 'Tom Sawyer', author: 'Mark Twain', price: '28', quantity: '2', action: 'xx'},
        {number: '2', title: 'Alice\'s Adventure in Wonderland', author: 'Lewis Carroll', price: '17.00', quantity: '2', action: 'xx'},
        {number: '3', title: 'The Old Man and the Sea', author: 'Ernest Hemingway', price: '17', quantity: '1', action: 'xx'}

    ];


$scope.addPerson = function (){
    var person = {
        number: $scope.number,
        title: $scope.title,
        author: $scope.author,
        price: $scope.price,
        quantity: $scope.quantity,
        action: $scope.action

    };

    $scope.people.push( person );

 //call calculate total here
 $scope.totPrice()
};

$scope.removePerson = function (index){
    $scope.people.splice( index, 1 );
 //call calculate total here
 $scope.totPrice()


};

$scope.totPrice = function (){
    var totPrice = 0;
    var values = [$scope.people]
    angular.forEach(values, function(price, quantity) {
        totPrice += (price * quantity)
    });
    return totPrice;
};
$scope.totQty = function (){
    var totQty = 0;
    angular.forEach(
        $scope.people.quantity, function (quantity){
            totQty += (
                $scope.people.quantity * $scope.people.title
                );
            return totQty; }
    );



};
}

答案 1 :(得分:0)

如果我理解正确的话,totPrice会计算总价格,并且从HTML脚本中调用addPerson作为ng-click事件?

您是否已尝试执行:

$scope.$apply();

说角度你有变化吗?

如何显示"总价格"在你的HTML?

更好的variante将是:

  $scope.totPrice = function (){
    var totPrice = 0;
    var values = [$scope.people]
    angular.forEach(values, function(price, quantity) {
        totPrice += (price * quantity)
    });
    $scope.totalPrice = totPrice;
};

<span ng-bind="totalPrice">

而是将totalPrice存储在变量中并绑定它。