क्यों एक "सार: सत्य" राज्य एक यूआरएल देते हैं?

Question

मैं आईओनिक में मचान को बेहतर ढंग से समझने की कोशिश में आज यूई-राउटर के साथ झुका रहा हूं और एक बात जो मैंने देखी थी वह था कि वे "टैब" की सारणी को एक यूआरएल देते हैं।

एकमात्र बार मैंने कभी भी अमूर्त राज्यों का उपयोग किया है, मैंने यूआरएल के रूप में एक खाली स्ट्रिंग का उपयोग किया और मुझे पता चला कि अगर मैंने कभी गलती से एक अमूर्त राज्य (बच्चे के राज्य के विपरीत) पर नेविगेट करने का प्रयास किया है तो मुझे मिलता है त्रुटि:

Cannot transition to abstract state '[insertAbstractStateHere]'

संपादित करें:

"इसके अलावा, प्रयोग, जब मैं (आयोनिक के बाहर) मेरी सार राज्य के लिए एक यूआरएल आवंटित करने के लिए कोशिश करते हैं और अभी भी नेस्टेड राज्य विचारों प्रस्तुत करना है, मैं एक बड़ा हंस अंडे। कुछ भी बिल्कुल दिखाई नहीं देता है। "

उपरोक्त उद्धृत बयान गलत है! मैंने इसे फिर से Plunker में आजमाया और घोंसला वाले राज्यों ने दिखाया।

angular.module('routingExperiments', ['ui.router']) 
     .config(function($urlRouterProvider, $stateProvider) { 

    $stateProvider 

     .state('abstractExperiment', { 
     abstract: true, 
     url: '', //<--- seems as if any string can go here. 
     templateUrl: 'abstractExperiment.html' 
     }) 
     .state('abstractExperiment.test1', { 
     url: '/test1', 
     templateUrl: 'abstractTest1.html' 
     }); 
    }); 

स्पष्ट रूप से मैं वास्तव में यह गलत कर रहा था। तो मेरा नया सवाल यह है:

क्या कोई कारण है कि कोई अमूर्त राज्यों को नियोजित करने में खाली स्ट्रिंग के विपरीत नामित राज्य का उपयोग क्यों करेगा, या यह सिर्फ एक स्टाइल पसंद है?

Answer 1

कारण आप एक अमूर्त राज्य का उपयोग करने का कारण है अपनी परिभाषा शुष्क जब आपके यूआरएल गैर-नौसेना का हिस्सा है। उदाहरण के लिए, मान लें कि आप निम्नलिखित की तरह एक url योजना थी: (यानी एक पेज के लिए कोई उद्देश्य)

/home/index 
/home/contact 

हालांकि, जो भी आपके डिजाइन में कारण के लिए, इस url अमान्य था:

/home 

अब आप पूरी स्थिति के साथ इस स्थिति के लिए दो राज्य बना सकते हैं, फिर भी आप /home/ दो बार लिखेंगे, और विवरण थोड़ा और अधिक मजबूत है। कि माता पिता राज्य के अंदर है, हम एक टेम्पलेट जिसका एकमात्र संतान आवंटित

$stateProvider 
    .state('parent', { 
     url: '/home', 
     abstract: true, 
     template: '<ui-view/>' 
    }) 
    .state('parent.index', { 
     url: '/index', 
     templateUrl: 'index.html' 
    }) 
    .state('parent.contact', { 
     url: '/contact', 
     templateUrl: 'contact.html' 
    }) 

बस नोटिस: सबसे अच्छा विचार के बजाय एक घर सार माता पिता जिनमें से दो अन्य राज्यों बच्चों (यूआई-रूटर डॉक्स के लिए) कर रहे हैं बनाने के लिए है एक ui-view। यह सुनिश्चित करता है कि बच्चों को प्रदान किया जाता है (और हो सकता है कि आपका खाली खाली क्यों दिखाई दे रहा हो)।

---

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

Answer 2

अमूर्त राज्य का उपयोग करें, यूयू राउटर को नियंत्रक/पृष्ठ को फिर से लोड करने के साथ नेविगेशन करने के लिए भी सक्षम करें।

Answer 3

.state('home', { 
     url: '/home', 
     abstract:true,       
     controller: "HomeController", 
     templateUrl:"path to your html"      
}) 
.state('home.list', { 
     url:"", 
     controller: "HomelistController", 
     templateUrl:"path to your html" 
})