AngularJS奇怪的行为与模型在视图中

Question

我对Angular中的一些模型/视图数据有一些非常奇怪的行为。真的是两个问题。在我的控制器中，我有以下代码，用于更新视图中的某些日期。

$scope.setCurrentDates = function () {

                var centreIndex = $scope.state.indexOfCentreDate,
                    centreIndexItem = $scope.state.allDays[centreIndex],
                    itemLeft = $scope.state.allDays[centreIndex - 1],
                    itemRight = $scope.state.allDays[centreIndex + 1];

                $timeout(function () {

                    $scope.state.currentDates.centre =  $scope.state.allDays[centreIndex].isoStringdate;
                    $scope.state.currentDates.left = itemLeft.isoStringdate;
                    $scope.state.currentDates.right = itemRight.isoStringdate;

                    $scope.state.isUpdatingDate = false;

                });
            };

然后在我看来，我有以下作为右/进度导航箭头：

    <a>
        <span class="day">{{state.currentDates.right | navDate : 'dd'}}</span>
        <span class="month">{{state.currentDates.right | navDate : 'MMM'}}</span>
        <span class="year">{{state.currentDates.right  | navDate : 'yyyy' }}</span>

    </a>

每次点击上面的导航都会调用控制器中的$ scope.setCurrentDates。

所以，第一个问题如下：

首次加载页面时，不显示日期文本。但是，当我在开发工具中检查元素时，例如将字体大小从50px增加到51px时，将显示文本。当我点击导航时，日期不会像在视图中那样更新。 但是当我再次检查元素，并将字体大小减小到50px时，日期会更新???离奇。对于我修改的此元素的任何一个CSS属性都会发生这种情况。

然后他们按照每次点击更新，但随后再次停止更新，直到我再次修改CSS。

起初我虽然这是一个范围问题，但我不太确定，因为在控制台中注销时日期更新正确。所以它必须与Chrome / CSS渲染相关。

进一步的离奇是附带的。您可以看到开发工具DOM，表示正确的值，包括在元素#console内，该元素由屏幕上呈现的黑框表示。

实际上看起来这可能与Chrome隔离。

任何建议都非常感谢。

谢谢，

戴夫

Answer 1

此处找到了Chrome呈现问题的解决方案：Google Fonts are not rendering on Google Chrome。

归结为Chrome被告知要重新渲染字体。