被显示在页面加载前避免pressions [英] Avoiding expressions being shown on page load

问题描述

在在一个点一个AngularJS视频我看到如何避免一个前pression是可见的JavaScript解析它。但我不记得它是怎么做...

In an AngularJS video at one point I saw how to avoid an expression being visible before the Javascript parses it. But I can't remember how it was done...

我有一个＆LT; D​​IV ID ='消息'＆GT; {{$ root.initializing.status}}＆LT; / DIV＆GT; ，我想说载入中...AngularJS之前有机会解析它。如何才能做到这一点？

I have a <div id='message'>{{$root.initializing.status}}</div> that I'd like to say "Loading..." before AngularJS has a chance to parse it. How can this be done?

推荐答案

随着其他提到的，使用NG-斗篷也添加以下你的CSS，如果它是第一个在你的页面加载。

As the others mentioned, use ng-cloak but also add the following to your CSS if it is the first to load in your page.

[ng\:cloak],[ng-cloak],.ng-cloak{display:none !important}

这将确保您的DIV模板是隐藏的。下面说DIV模板，添加类似

This will ensure that your div template is hidden. Below that div template, add something like

在$ root.initializing.status与原因NG隐藏的真正价值的分配。

The assignment of the $root.initializing.status with cause a true value for ng-hide.

下面是的jsfiddle 和以下是code：

Here is the jsfiddle and the following is the code:

HTML

<div ng-controller='Ctrl'>
    <div id='message'>{{$root.initializing.status}}</div>
    <div ng-hide="$root.initializing.status">Loading...</div>
</div>

JS：

function Ctrl($timeout, $scope) {
///simulating loading
    $timeout(function () {
        $scope.$root = {
            initializing: {
                status: 'Complete!'
            }
        }
    }, 2000);
}

这篇关于被显示在页面加载前避免pressions的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！