ngCloak指令不起作用

时间:2016-05-05 11:33:14

标签: javascript angularjs

我已经像这样使用了ngCloak指令

public View onCreateView(LayoutInflater inflater,  ViewGroup container,  Bundle savedInstanceState) {
        View view;
        view= inflater.inflate(R.layout.tabs,container,false);
        bible_group = (RadioGroup)view.findViewById(R.id.bible_group);

        bible_group.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener(){

            @Override
            public void onCheckedChanged(RadioGroup group, int checkedId) {

                switch (checkedId){

                    case R.id.genesis:
                    case R.id.exodus:
                    case R.id.leviticus:
                    case R.id.numbers:
                    case R.id.deuteronomy:
                    case R.id.joshua:
                    case R.id.judges:
                    case R.id.ruth:
                    case R.id.samuel1:
                    case R.id.samuel2:
                    case R.id.kings1:
                    case R.id.kings2:
                    case R.id.chronicles1:
                    case R.id.chronicles2:
                    case R.id.ezra:
                    case R.id.nehemiah:
                    case R.id.esther:
                    case R.id.job:
                    case R.id.psalm:
                    case R.id.proverbs:
                    case R.id.ecclesiastes:
                    case R.id.songofsolomon:
                    case R.id.isaiah:
                    case R.id.jeremiah:
                    case R.id.lament:
                    case R.id.ezek:
                    case R.id.dan:
                    case R.id.hosea:
                    case R.id.joel:
                    case R.id.amos:
                    case R.id.obadiah:
                    case R.id.jonah:
                    case R.id.micah:
                    case R.id.nahum:
                    case R.id.habakkuk:
                    case R.id.zephaniah:
                    case R.id.haggai:
                    case R.id.zechariah:
                    case R.id.malachi:
                    case R.id.matthew:
                    case R.id.mark:
                    case R.id.luke:
                    case R.id.john:
                    case R.id.acts:
                    case R.id.romans:
                    case R.id.corinths1:
                    case R.id.corinths2:
                    case R.id.galatians:
                    case R.id.ephesians:
                    case R.id.phili:

当我刷新页面时,它显示未编译的原始数据,如{{note。$ hashkey}}。我不知道自己做错了什么。

2 个答案:

答案 0 :(得分:4)

您可以将以下CSS规则添加到html文件的head部分,以确保规则在加载时立即可用。

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

否则,在加载angular.js文件时会激活它们,这通常为时已晚,无法阻止显示原始模板。

答案 1 :(得分:0)

使用ng-cloak工作的css规则由angular.js文件嵌入。因此,如果它包含在html文件的末尾,则可能无法按预期工作。

您可以通过将以下脚本标记移动到html的主题部分来修复它:

<script src="angular.js"></script>

或者您可以将以下css规则添加到html主题部分中包含的css文件中:

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