I have a strange behavior using an Angular template with a controller . A special view content often updates on mouse over only. I have setup a few jsFiddles but cannot reproduce the problem. So it is obviously a mistake in my source code. The only special thing I see here is that I use a $scope
method to format and display HTML content. {{order.total()}} €
It is weird that it work sometimes.
All other HTML parts are updating as expected. Any idea what could be wrong?
$scope.order = {
_total : 0,
total : function() {
return Globalize.format(this._total, "n");
},
positions: []
};
$scope.addProductToCurrentOrder = function(packageIndex, productId) {
var rs = {
_id : productId
};
var tab = $scope.categories[packageIndex].packages;
for (var i = 0; i < tab.length; i++) {
var pack = tab[i];
if (pack.productId === productId){
pack.quantity++;
rs.articleName = pack.name;
rs.price = pack.price;
rs._price = pack._price;
rs.unit = pack.unit;
rs.weight = pack.weight;
break;
}
}
$scope.order.positions.push(rs);
$scope.order._total += rs._price;
};
<h1>
<span class="btn btn-default btn-large">{{order.total()}} €</span>
</h1>
<div data-id="{{package.productId}}" class="btn bt-default panel panel-default order order-card withripple" ng-click="addProductToCurrentOrder($parent.$index, package.productId)">
<div class="panel-body">
<p class="lead"> {{package.name}}</p>
<p>{{package.weight}} {{package.unit}}</p>
</div>
<div class="ripple-wrapper"></div>
</div>
there might be no reason your expression not be working, so instead I will
What is the library behind ?
Mock Globalize function
http://jsfiddle.net/darul75/5L2d9y75/