Моделирование, использующее ng-change, не обновляется нажатием

0

ОБНОВЛЕНО

я думаю

ng-init="currentQuantity=item.quantity"

просто предотвращает обновление текущего состояния ng-модели до следующего добавочного значения. Есть ли обходные пути для этого в приведенном ниже примере?

Могу ли я, например, указать модель currentQuantity по индексу, поэтому я знаю, какая модель меня меняется, а не все сразу?



В настоящее время у меня проблемы с AngularJS. Под кодом ниже я добавляю продукты в массив корзин:

QuantityChanged(product, currentQuantity);

Затем у меня есть кнопка + рядом с этим полем ввода, которое просто добавляет +1 количество продукта в корзину.

<button class="plus-button" ng-click="addToCart(product);">+</button>

Однако моя ng-model = "currentQuantity" обновляется только при использовании функции QuantityChanged (product, currentQuantity), но не тогда, когда я использую функцию ng-click = "addToCart (продукт)".

Если я посмотрю в своем локальном хранилище, я вижу, что количество корзины успешно обновляется, но когда я смотрю на текущее значение текстового поля ввода ng-model: currentQuantity, я вижу, что ничего не изменилось. Когда я обновляюсь, я увижу правильное значение в поле ввода. Мне что-то не хватает?

Посмотреть:

<span ng-repeat="item in cart">
      <span ng-if="item.id === product.id">
            <input type="text" ng-change="QuantityChanged(product, currentQuantity);" ng-model="currentQuantity" ng-init="currentQuantity=item.quantity" class="product-aantal"  />
      </span>
</span>

<button class="plus-button" ng-click="addToCart(product);">+</button>

Некоторый код контроллера (если необходимо):

$scope.QuantityChanged = function (product, quantity) {

        quantity = parseFloat(quantity, 6);

        $scope.cart.forEach(function (item) {
            if (item.id === product.id) {

                if(item.quantity < quantity){
                    $scope.productCounter = $scope.productCounter + (quantity - item.quantity);
                }
                if(item.quantity > quantity){
                    $scope.productCounter = $scope.productCounter - (item.quantity - quantity);
                }

                item.quantity = quantity;
                item.totalprice = parseFloat(item.price,6) * quantity;
            }
        });

        this.saveProducts($scope.cart);
        this.saveProductCounter($scope.productCounter);

    };


$scope.addToCart = function (product) {

        var found = false;
        $scope.cart.forEach(function (item) {
            if (item.id === product.id) {
                item.quantity++;
                $scope.productCounter++;
                item.totalprice += parseFloat(item.price,6);
                found = true;
            }

        });
        if (!found) {
            $scope.cart.push(angular.extend({quantity: 1, totalprice: parseFloat(product.price,6) }, product));
            $scope.productCounter += 1;
        }


        this.saveProducts($scope.cart);
        this.saveProductCounter($scope.productCounter);

    };
  • 0
    Попробуйте создать дайджест с $ timeout внутри addToCart.
  • 0
    Можете ли вы привести пример использования этого метода?
Показать ещё 2 комментария
Теги:

1 ответ

1
Лучший ответ

Это связано с объемом ng-повтора.

Измените currentQuantity на current.quantity, а внутри addToCart также измените это значение.

скрипка

if (item.id === product.id) {
    item.quantity++;
    $scope.current.quantity++;
    $scope.productCounter++;
    item.totalprice += parseFloat(item.price,6);
    found = true;
}

Я должен сказать, что ваша логика довольно трудно понять, но это устраняет проблему.

  • 0
    Спасибо, это решение работает, но вы правы. Я работаю над альтернативным решением, которое в первую очередь не должно было вызывать этих проблем. Я опубликую это позже.
  • 0
    Решил это сейчас с помощью простого $ index для ng-repeat и ng-model, чтобы выбрать правильную ng-модель. Скрипка: jsfiddle.net/zgr73s9z/11
Показать ещё 1 комментарий

Ещё вопросы

Сообщество Overcoder
Наверх
Меню