राज्य से '...' का समाधान नहीं हो सका

Question

यह पहली बार है जब मैं यूआई-राउटर का उपयोग करने की कोशिश कर रहा हूं।

यहाँ मेरे app.js है

angular.module('myApp', ['ionic'])

.run(function($ionicPlatform) {
  $ionicPlatform.ready(function() {
    // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
    // for form inputs)
    if(window.cordova && window.cordova.plugins.Keyboard) {
      cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
    }
    if(window.StatusBar) {
      StatusBar.styleDefault();
    }
  });
})

.config(function($stateProvider, $urlRouterProvider){
  $urlRouterProvider.otherwise("/index.html");

  $stateProvider.state('index', {
    url: '/'
    template: "index.html",
    controller: 'loginCtrl'
  });


  $stateProvider.state('register', {
    url: "/register"
    template: "register.html",
    controller: 'registerCtrl'
  });
})

जैसा कि आप देख सकते हैं, मेरे पास दो राज्य हैं। मैं इस तरह राज्य को पंजीकृत करने की कोशिश कर रहा हूं:

<a ui-sref="register">
  <button class="button button-balanced">
    Create an account
  </button>
</a>

लेकिन मुझे मिल रहा है

राज्य से 'रजिस्टर' को हल नहीं कर सका

अपवाद। यहां क्या समस्या है?

Comments

यह मूर्खतापूर्ण है, लेकिन मैं देख रहा हूं कि आप 'myApp' मॉड्यूल बना रहे हैं और 'आयनिक' को एक निर्भरता के रूप में सूचीबद्ध कर रहे हैं, हालांकि, मैं 'यूआई-राउटर' को एक निर्भरता के रूप में सूचीबद्ध नहीं देखता हूं। क्या आप इसे कहीं और शामिल कर रहे हैं?

— deadbabykitten

@deadbabykitten, आयनिक का ख्याल रखता है।

— रोजर्स सम्पै

@RogersSampaio - मुझे अभी हाल ही में पता चला है कि मैंने पहले आयनिक का उपयोग नहीं किया था, लेकिन अब एक मोबाइल परियोजना के लिए इसका उपयोग कर रहा हूं। यह बहुत अविश्वसनीय है।

— डेडबैंकिटेड

Answer 1

इस तरह की त्रुटि का आमतौर पर मतलब है कि (जेएस) कोड के कुछ हिस्सों को लोड नहीं किया गया था। वह राज्य जो अंदर है ui-srefवह गायब है।

नहीं है एक काम उदाहरण

मैं आयनिक का विशेषज्ञ नहीं हूं, इसलिए इस उदाहरण से पता चलता है कि यह काम कर रहा होगा, लेकिन मैंने कुछ और तरकीबें (टैब के लिए माता-पिता) का इस्तेमाल किया

यह थोड़ा समायोजित राज्य दोष है:

.config(function($stateProvider, $urlRouterProvider){
  $urlRouterProvider.otherwise("/index.html");

    $stateProvider

    .state('app', {
      abstract: true,
      templateUrl: "tpl.menu.html",
    })

  $stateProvider.state('index', {
    url: '/',
    templateUrl: "tpl.index.html",
    parent: "app",
  });


  $stateProvider.state('register', {
    url: "/register",
    templateUrl: "tpl.register.html",
    parent: "app",
  });

  $urlRouterProvider.otherwise('/');
}) 

और यहां हमारे पास टैब और उनकी सामग्री के साथ माता-पिता का दृष्टिकोण है:

<ion-tabs class="tabs-icon-top">

  <ion-tab title="Index" icon="icon ion-home" ui-sref="index">
    <ion-nav-view name=""></ion-nav-view>
  </ion-tab>

  <ion-tab title="Register" icon="icon ion-person" ui-sref="register">
    <ion-nav-view name=""></ion-nav-view>
  </ion-tab>

</ion-tabs>

इसे चलाने के तरीके के उदाहरण से अधिक लें और बाद में आयनिक ढांचे का सही तरीके से उपयोग करें ... उस उदाहरण को यहां देखें

यहां दिए गए विचारों (निश्चित रूप से बेहतर समाधान के लिए) आयनिक मार्ग समस्या का उपयोग करके एक उदाहरण के साथ प्रश्नोत्तर समान है , खाली पृष्ठ दिखाता है

एक टैब में नामित विचारों के साथ बेहतर संस्करण यहाँ है: http://plnkr.co/edit/Mj0rUxjLOXhHIelt249K?p=preview

  <ion-tab title="Index" icon="icon ion-home" ui-sref="index">
    <ion-nav-view name="index"></ion-nav-view>
  </ion-tab>

  <ion-tab title="Register" icon="icon ion-person" ui-sref="register">
    <ion-nav-view name="register"></ion-nav-view>
  </ion-tab>

नामित विचारों को लक्षित करना:

  $stateProvider.state('index', {
    url: '/',
    views: { "index" : { templateUrl: "tpl.index.html" } },
    parent: "app",
  });


  $stateProvider.state('register', {
    url: "/register",
    views: { "register" : { templateUrl: "tpl.register.html", } },
    parent: "app",
  });

Comments

मेरे मार्ग ठीक दिखते हैं, मैंने अन्य आयनिक उदाहरणों की जाँच की और मेरा कोड समान दिखता है। मैंने कुछ डिबगर, कंसोल.लॉग और अलर्ट उस कॉन्फिग फंक्शन में डाले और उनमें से कोई भी निष्पादित नहीं हुआ। मैं यह कैसे सुनिश्चित कर सकता हूं कि मेरे मार्ग लोड किए गए हैं? क्या मैं उन्हें किसी तरह देख सकता हूँ?

— सेफा

यदि मैं यह देखने के लिए उत्सुक हूं कि कौन से राज्य पंजीकृत हैं, तो मैं आम तौर पर $ .run () विधि से राज्य की जानकारी को इंजेक्ट करूंगा। तब आप कंसोल .log ($ states.get ()) कर सकते हैं जो राज्यों की एक सरणी लौटाएगा। .run ($state) { console.log($states.get()); });

— deadbabykitten

Answer 2

बस यहाँ साझा करने के लिए आया था कि मेरे साथ क्या हो रहा था।
आपको माता-पिता को निर्दिष्ट करने की आवश्यकता नहीं है, राज्य एक दस्तावेज़ उन्मुख तरीके से काम करते हैं, इसलिए माता-पिता को निर्दिष्ट करने के बजाय: ऐप, आप बस राज्य को ऐप में बदल सकते हैं।

.config(function($stateProvider, $urlRouterProvider){
    $urlRouterProvider.otherwise("/index.html");

$stateProvider.state('app', {
  abstract: true,
  templateUrl: "tpl.menu.html"
});

$stateProvider.state('app.index', {
    url: '/',
    templateUrl: "tpl.index.html"
});

$stateProvider.state('app.register', {
    url: "/register",
    templateUrl: "tpl.register.html"
});

EDIT वार्निंग, यदि आप नेस्टिंग में गहराई से जाना चाहते हैं, तो पूरा रास्ता मुझे निर्दिष्ट करना चाहिए। उदाहरण के लिए, आपके पास कोई राज्य नहीं हो सकता

app.cruds.posts.create

बिना किसी

app
app.cruds
app.cruds.posts

या कोणीय अपवाद को यह कहते हुए फेंक देगा कि यह मार्ग का पता नहीं लगा सकता है। यह हल करने के लिए कि आप अमूर्त अवस्थाओं को परिभाषित कर सकते हैं

.state('app', {
     url: "/app",
     abstract: true
})
.state('app.cruds', {
     url: "/app/cruds",
     abstract: true
})
.state('app/cruds/posts', {
     url: "/app/cruds/posts",
     abstract: true
})

Comments

के लिए धन्यवाद EDIT Warning, if you want to go deep in the nesting, the full path must me specified. For example, you can't have a state like, यह मेरा मुद्दा था।

— अधिकतम

मुझे ऊपर की तरह ही समस्या थी, लेकिन मैं अपने राज्य के नाम पथ में कुछ भी शामिल करना चाहता था जो कि मार्ग पथ में परिलक्षित नहीं होगा, इसलिए आप urlमध्य राज्य की संपत्ति को बाहर कर सकते हैं , और फिर निम्नलिखित मार्ग urlको जोड़ा जाएगा। पिछला मार्ग url।

— निक एम

Answer 3

Ionic के साथ मेरा बस यही मुद्दा रहा है।

यह मेरे कोड के साथ कुछ भी गलत नहीं था, मुझे बस आयनिक सेवा सत्र छोड़ना पड़ा और आयनिक सेवा फिर से चलाना पड़ा।

ऐप में वापस जाने के बाद, मेरे राज्यों ने ठीक काम किया।

मैं यह भी सुझाव दूंगा कि आप अपने app.js में कुछ समय के लिए सेव करें। अगर आप gulp चला रहे हैं तो सुनिश्चित करें कि सब कुछ फिर से संकलित हो जाए।

Comments

मेरे मामले में सर्वर को फिर से शुरू करने से समस्या हल नहीं हुई, लेकिन मुझे डीबग करने में बेहतर त्रुटि हुई। धन्यवाद!

— मैगस

Answer 4

Ionic मार्ग के साथ एक ही मुद्दा था।

मूल समाधान राज्य के नाम का उपयोग करना है - मूल रूप से state.go(state name)

.state('tab.search', {
    url: '/search',
    views: {
      'tab-search': {
        templateUrl: 'templates/search.html',
        controller: 'SearchCtrl'
      }
    }
  })

और नियंत्रक में आप उपयोग कर सकते हैं $state.go('tab.search');

Answer 5

मेरे पास एक मामला था जहां त्रुटि को एक द्वारा फेंका गया था

$state.go('');

जो स्पष्ट है। मुझे लगता है कि यह भविष्य में किसी की मदद कर सकता है।

Answer 6

मैगस द्वारा उत्तर के रूप में:

पूर्ण पथ मुझे निर्दिष्ट करना चाहिए

एब्सट्रैक्ट स्टेट्स का इस्तेमाल सभी चाइल्ड स्टेट यूरल्स में प्रीफिक्स जोड़ने के लिए किया जा सकता है। लेकिन ध्यान दें कि अमूर्त को अभी भी अपने बच्चों को आबाद करने के लिए एक यूआई-व्यू की आवश्यकता है । ऐसा करने के लिए आप इसे केवल इनलाइन जोड़ सकते हैं।

.state('app', {
   url: "/app",
   abstract: true,
   template: '<ui-view/>'
})

अधिक जानकारी के लिए देखें दस्तावेज: https://github.com/angular-ui/ui-router/wiki/Nested-States-%26-Nested-Views