एंगुलरजेएस

में एनजी-क्लोक का उपयोग करने वाले फूटर टेम्पलेट ब्लिंक भी मैं कोणीय जेएस का उपयोग कर आरईएसटी सेवा से पुनर्प्राप्त कुछ डेटा के साथ टेम्पलेट्स को सशक्त बना और प्रदर्शित करता हूं, लेकिन जब JSON प्रतिक्रिया अभी भी लोड हो रही है, ब्राउज़र शीर्ष पर पाद लेख टेम्पलेट दिखाता है और, जब प्रतिक्रिया JSON डेटा लौटाती है, तो पाद लेख नीचे जाता है।एंगुलरजेएस

यह बहुत तेज़ी से होता है, लेकिन नीचे जाने से पहले पृष्ठ के शीर्ष पर पाद लेख टेम्पलेट चमकता है।

मैंने एनजी-क्लोक दृष्टिकोण का उपयोग करने की कोशिश की है, दुर्भाग्यवश, समस्या अभी भी हो रही है। मैंने सीएसएस को एनजी-क्लोक में API Reference अनुशंसा के रूप में रखा है।

<body> 
    <div data-ng-controller="HeaderCtrl" data-ng-include="'app/partials/header.html'"></div> 
    <div data-ng-controller="MenuCtrl" data-ng-include="'app/partials/lista-menu.html'"></div> 
    <div ng-view="main" ></div> 
    <footer class="nav" data-ng-include="'app/partials/footer.html'" ></footer>

मैं शरीर टैग, एनजी-व्यू, पाद लेख पर एनजी-लबादा डाल कोशिश, और यह भी एनजी-व्यू एचटीएमएल टेम्पलेट के अंदर:

यहाँ मेरी एप्लिकेशन कोड है। इस कोड का प्रतिनिधित्व करता है के लिए सभी प्रयास (नोट: मैं अलग और एक साथ इस्तेमाल करने की कोशिश की है, एनजी-लबादा वर्ग के साथ और नहीं)

<body ng-cloak class="ng-cloak"> 
    <div data-ng-controller="HeaderCtrl" data-ng-include="'app/partials/header.html'"></div> 
    <div data-ng-controller="MenuCtrl" data-ng-include="'app/partials/lista-menu.html'"></div> 
    <div ng-view="main" ng-cloak class="ng-cloak"></div> 
    <footer class="nav" data-ng-include="'app/partials/footer.html'" ng-cloak class="ng-cloak"></footer>

दुर्भाग्य से इन सभी परिवर्तनों के बाद, पाद लेख टेम्पलेट अभी भी शीर्ष पर झपकी से पहले लोड हो रहा है पूरा हो गया है ।

कोई भी इसे ठीक करने में मेरी सहायता कर सकता है?

क्या कोई भी बूटस्ट्रैप चालक को नीचे की ओर रखने के लिए है, भले ही मुख्य div ऊंचाई के बिना हो? मैंने एनवी-फिक्स्ड-डाउन टैग का उपयोग करने का प्रयास किया है, लेकिन जब पेज में उच्च ऊंचाई मान हैं तो मैं स्क्रीन पर नीचे तय नहीं करना चाहता हूं।

धन्यवाद !!!

स्रोत

2013-02-17 Deividi Cavarzan

एनजी-लबादा और/या ng-bind इस समस्या को हल करने में मदद नहीं कर सकते, क्योंकि यह "असंगत सामग्री का फ्लैश" समस्या नहीं है। उन निर्देशों का उद्देश्य सामग्री को छिपाने के लिए है जब तक कि कोणीय को HTML को संकलित करने का मौका न हो।

जिस समस्या को आप हल करने का प्रयास कर रहे हैं वह इस प्रकार है: "मैं पृष्ठ पर गतिशील रूप से सामग्री जोड़ रहा हूं और सामान चारों ओर घूम रहा है"। यदि आप मुख्य सामग्री लोड होने के बाद ही पाद लेख दिखाना चाहते हैं, तो मुझे उनकी टिप्पणी में दिए गए समाधान @ एलेक्स को पसंद है।

स्रोत

2013-02-19 15:44:27

मैंने कोशिश की है लेकिन यह अभी भी फ़ायरफ़ॉक्स में पुनः लोड पर झपकी है ... – Sikander

क्या आपने दो बार जांच की है कि क्या आपके पास कोई सीएसएस नियम है जो एनजी-क्लोक नियम से विवादित हो सकता है? यह अन्य शैलियों, पुस्तकालयों आदि के साथ हो सकता है

यदि आपके पास कोई नियम है जो संघर्ष करता है, तो बस display:none; जोड़ना पर्याप्त नहीं हो सकता है।

Angularjs - ng-cloak/ng-show elements blink

देखें यदि यह मामला है, समाधान का उपयोग करने के लिए है इस पर काबू पाने के लिए महत्वपूर्ण:

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

स्रोत

2013-02-18 03:13:32

आपकी मदद के लिए धन्यवाद एलेक्स। मैंने आपका संदर्भ पढ़ा, और जब मैं अपने सीएसएस में महत्वपूर्ण टैग डाल रहा हूं, यह पहले से ही है! मैं सोच रहा हूं कि, क्योंकि 2 अलग-अलग टेम्पलेट्स हैं, फ़ूटर टेम्पलेट पहले से पहले प्रस्तुत करता है। मैंने ऐप को असीमित रूप से चलाने की कोशिश की, लेकिन समस्या बनी रहती है। इस बिंदु पर मुझे मिला एकमात्र समाधान है कि मेरे मुख्य एनजी-व्यू के अंदर पाद लेख की सामग्री डालना है, लेकिन शायद यह सबसे अच्छा अभ्यास नहीं है क्योंकि मुझे हर कोड पर यह कोड रखना होगा। –

हम्म हां जो समझ में आता है। कोशिश करने के लिए एक अन्य दृष्टिकोण - एनजी-क्लोक के बजाय, एनजी-शो डालें, लेकिन एक स्कोप वैरिएबल पर जिसे आप केवल तब सेट करते हैं जब आपकी मुख्य सामग्री लोड हो गई है/अनुरोध पूरा हो गए हैं आदि - ताकि जब आप पाद लेख दिखाई देंगे तो मैन्युअल रूप से सेटिंग हो। –

इस समस्या का सबसे अच्छा समाधान यह टिप्पणी है, शायद आप इसे अपने उत्तर में शामिल कर सकते हैं, @AlexOsborn? – markus

जैसा कि एलेक्स और मार्क ने कहा, एनजी-क्लोक इस मामले में कोई लाभ नहीं प्रदान करता है। हालांकि मैंने कुछ ऐसा किया जो मेरे लिए काम करता था और दूसरों की भी मदद कर सकता था।

प्रारंभ में, मैं पाद लेख प्रदर्शित नहीं करता हूं।

.footer { 
    display: none; 
}

तब सामग्री को लोड करने के साथ कोणीय किया जाता है, तो पाद लेख प्रकट होता है।

var app = angular.module('app', [...]) 
.run(function($rootScope) { 
    $rootScope.$on('$viewContentLoaded', function(event){ 
     $('.footer').fadeIn(500); 
    }); 
});

स्रोत

2015-03-24 14:46:03

उत्तर

संबंधित मुद्दे