2015-05-20 9 views
7

मुझे $routeProvider के साथ समस्याएं हैं (हालांकि मामूली)।

http://localhost/thisapp/ ठीक काम करता है, और .otherwise() पर रीडायरेक्ट करता है। लेकिन ऐसा लगता है कि एक बार ऐप लोड हो जाने पर और "होम" यूआरएल (http://localhost/thisapp/#/) पर

फिर यह टूट जाता है।

अगर मैं http://localhost/thisapp पर नेविगेट $location अगर मैं ताज़ा (क्योंकि आप जानते हैं कि उपयोगकर्ता को उस काम हो जाएगा) http://localhost/thisapp/#/

पर ले कर जाता है, तो कोड

मैं $locationProvider का उपयोग कर की कोशिश की है टूट जाता है, लेकिन वह भी ज्यादा है भ्रामक। ऐसा लगता है कि मैं इसे जितना अधिक पढ़ता हूं, उतना ही उलझन में आता है क्योंकि दस्तावेज जो काम करता है वह काम नहीं करता है। (यदि मैं नीचे $locationProvider लाइन को अपूर्ण करता हूं, तो कुछ भी उत्पन्न नहीं होता है)। मैंने स्टैक ओवरफ्लो पर विभिन्न ट्यूटोरियल और मुद्दों को देखा है, लेकिन ऐसा लगता है कि ऐसा नहीं लगता है।

myApp.config(function($routeProvider, $locationProvider) { 

    // commented cuz it's not working 
    // $locationProvider.html5Mode(true); 

    $routeProvider 
     .when('/', { 
      templateUrl: 'app2/components/templates/overview.html', 
      controller: 'overviewController' 
     }) 
     .when('/all_overview', { 
      templateUrl: 'app2/components/templates/overview.html', 
      controller: 'overviewController' 
     }) 
     .when('/all_procurement', { 
      templateUrl: 'app2/components/templates/procurement.html', 
      controller: 'procurementController' 
     }) 
     .when('/all_social', { 
      templateUrl: 'app2/components/templates/social.html', 
      controller: 'socialController' 
     }) 
     .when('/all_strengthening', { 
      templateUrl: 'app2/components/templates/strengthening.html', 
      controller: 'strengtheningController' 
     }) 
     .when('/all_sales', { 
      templateUrl: 'app2/components/templates/sales.html', 
      controller: 'salesController' 
     }) 

     // otherwise go to all_overview 
     .otherwise({ 
      redirectTo: '/all_overview' 
     }); 
}); 
+1

क्या आपको अपने कंसोल में कोई त्रुटि मिल रही है? यह वास्तव में कैसे टूटता है? –

+1

यह समस्या सभी ब्राउज़रों में लगातार है? –

+1

इसे हटाएं। .when ('/', { टेम्पलेटउआरएल: 'एपी 2/घटक/टेम्पलेट्स/ओवरव्यू.html', नियंत्रक: 'ओवरव्यू कंट्रोलर' }) –

उत्तर

1

यह डिफ़ॉल्ट रूटिंग व्यवहार (#) और एचटीएमएल 5 रूटिंग सक्षम करने की कोशिश कर की तरह लगता है आप समस्या आ रही है:

यहाँ मेरी config कोड है। .html5Mode(true) के आपके प्रयास के बावजूद, AngularJS के नए संस्करणों में <base href /> की धारणा है और काम करने के लिए अतिरिक्त चरणों की आवश्यकता है।

Before Angular 1.3 we didn't have this hard requirement and it was easy to write apps that worked when deployed in the root context but were broken when moved to a sub-context because in the sub-context all absolute urls would resolve to the root context of the app. To prevent this, use relative URLs throughout your app

पता करने के लिए क्या यह सापेक्ष URL का मतलब, यहाँ एक त्वरित उदाहरण ...

<!-- wrong: --> 
<a href="/userProfile">User Profile</a> 


<!-- correct: --> 
<a href="userProfile">User Profile</a> 

इसलिए, जब आप कहते हैं कि "कुछ भी नहीं उत्पन्न करता है" (सफेद स्क्रीन मुझे लगता है?) , अपने ब्राउज़र कंसोल का निरीक्षण करें और आपको निम्न त्रुटि

Uncaught Error: [$location:nobase]

इसे हल करने के कुछ तरीके हैं। आप निम्नलिखित तरीके

$locationProvider.html5Mode({ 
    enabled: true 
}); 

<html ng-app="app"> 
    <head> 
    <base href="/"> 
    </head> 
    ... 

में अपने ऐप्लिकेशन में <base href /> की एक धारणा शामिल कर सकते हैं या आप इस <base> टैग उपेक्षा और निम्नलिखित

$locationProvider.html5Mode({ 
    enabled: true, 
    requireBase: false 
}); 

के लिए के साथ अपने विन्यास संशोधित कर सकते हैं विषय पर अधिक जानकारी, कोणीय डॉक्स

देखें

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