我创建了一个指令,所有功能都可以,除了以下内容:
该指令是一个基本的购物车。该指令创建一个cartItem,它包含一个产品,并有一个额外的列数量和小计。
qty列是使用ng-repeat为购物车中的每个产品生成的基本选择元素。
我遇到的问题是我无法将qty值恢复到我的模型。
范围有一个属性$ scope.qty,选择绑定到使用ng-model ='qty',但模型值永远不会更新。
感谢任何帮助。
HTML
<select name='qty{{$index + 1}}' class='qtySelectItem{{$index + 1}}' ng-model='Qty5[$index]'>
<option value='1'>1</option>
<option value='2'>2</option>
<option value='3'>3</option>
<option value='4'>4</option>
<option value='5'>5</option>
<option value='6'>6</option>
<option value='7'>7</option>
<option value='8'>8</option>
<option value='9'>9</option>
<option value='10'>10</option>
</select>
{{Qty5[$index]}}
Javascript控制器
app.directive('cartItem', function () {
return {
restrict: "EA",
scope: {
// products: '=' // Passes the $scope.Products Object
//itemInCart: '=' // Passes a Scope Object
//addToCart: '&' // Passes a Scope Function
},
link: function (scope, element, attrs) {
},
templateUrl: 'Views/Cart/CartLineItem.html',
function controller($scope) {
$scope.ProductsInCart = getCartData();
$scope.ItemsInCart = $scope.ProductsInCart.length;
$scope.Qty5 = 1;
$scope.CartItem = [new CartItem()];
$scope.SubTotal2 = function () {
console.log('SubTotal2 - Listprice:' + $scope.Model[0].ProductItem.ListPrice);
console.log('SubTotal2 - Qty:' + $scope.Qty5);
var result = $scope.Model[0].ProductItem.ListPrice * $scope.Qty;
console.log('List Price:' + $scope.Model[0].ProductItem.ListPrice);
return result;
};
$scope.Model = formatForModel();
function getCartData() {
// ToProductItem(
var data = JSON.parse(GetSession("ItemsInCart"));
console.log(data.length);
return data;
};
function formatForModel() {
var result = [];
for (var i = 0; i < $scope.ProductsInCart.length; i++) {
var obj = new CartItem();
obj.ProductItem = $scope.ProductsInCart[i];
console.log('Product Item: ' + $scope.ProductsInCart[i]);
result.push(obj);
}
console.log('Model Data: ' + result);
return result;
};
}
};
});