角度视图模板内容仅在鼠标悬停时更新

Question

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> 

Answer 1

there might be no reason your expression not be working, so instead I will

• remove Globalize function call, then see what is going on with Globalize.
• compute globalize string when recomputing new Total.
• use of filter() angular expression to compute globalization.

What is the library behind ?

Mock Globalize function

var Globalize = {
  format : function(a,b) {
     return 22;   
  }
};

http://jsfiddle.net/darul75/5L2d9y75/