0

我正在使用 ng-view 在我的页面上呈现动态数据。当页面加载时,如果我使用静态 html,我会得到这个(顶部):

在此处输入图像描述

当 Angular 加载页面时,数据就在那里,但就像元素仍然是空的(底部)。

如果我在 Chrome 开发工具中进行最轻微的调整,这些项目就会卡入到位,但如果不使用 CSS 使它们成为静态大小,我就无法让它们预填充,这不起作用,因为文本大小不同。有问题的元素具有内联块的 CSS。

正如您在此屏幕截图中看到的那样,我尝试了两种填充数据的方法,两种方法都具有相同的结果:

<div class="cd-rating" ng-class="caseData.scoreClass">
    <span class="score" ng-bind="caseData.adjustedScore | number:0" ng-cloak>N/A</span>
    <span class="verdict">{{caseData.recommendation}}</span>
</div>

这是 HTML 在浏览器中的样子:

<div class="cd-rating medium" ng-class="caseData.scoreClass">
    <span class="score ng-binding" ng-bind="caseData.adjustedScore | number:0">349</span>
    <span class="verdict ng-binding">review</span>
</div>

如果我以相同的方式对该 HTML 进行硬编码,那么它会完美呈现。只有当 Angularjs 渲染它时,元素才会折叠,如果没有内容就会出现。

我还想补充一点,我正在使用 RequireJS 并手动引导应用程序,而不是使用 ng-app 指令,以防万一。

关于如何使视图填充元素的任何想法?

编辑:这是一个演示该行为的视频:http: //youtu.be/zTwv-o6mWRM

4

1 回答 1

0

我无法弄清楚“..data 仍然存在但元素为空..”的确切含义 - 我发现 AngularJS 渲染的唯一问题是“Review”(按钮?)被数字覆盖。

查看您的代码(正如@Wingman4l7 建议的那样,需要将其发布在问题中而不是作为图像),我看到您正在使用绑定来动态定义一个类。相反,您可以使用该ng-class指令并查看它是否解决了问题?

也就是说,替换:

<div class="cd-rating {{caseData.scoreClass}}">

<div class="cd-rating" ng-class="caseData.scoreClass">

而是检查问题是否得到解决?

于 2013-07-25T07:10:22.373 回答