मैं ui- राउटर v0.2.0 के साथ AngularJS v1.2.0-rc.2 का उपयोग कर रहा हूं। मैं रेफर करने वाले राज्य को दूसरे राज्य में भेजना चाहता हूं, इसलिए मैं इस तरह toParamsका उपयोग करता हूं $state.go:
$state.go('toState', {referer: $state.current.name});डॉक्स के अनुसार , यह नियंत्रक $stateParamsपर पॉप्युलेट होना चाहिए toState, लेकिन यह है undefined। मैं क्या खो रहा हूँ?
मैंने प्रदर्शित करने के लिए एक प्लंक बनाया है:
जवाबों:
यदि आप गैर-URL स्थिति को पास करना चाहते हैं, तो आपको urlअपना सेट अप करते समय उपयोग नहीं करना चाहिए state। मुझे एक पीआर पर जवाब मिला और बेहतर समझने के लिए आसपास कुछ मंकींग किया।
$stateProvider.state('toState', {
templateUrl:'wokka.html',
controller:'stateController',
params: {
'referer': 'some default',
'param2': 'some default',
'etc': 'some default'
}
});फिर आप इसे इस तरह नेविगेट कर सकते हैं:
$state.go('toState', { 'referer':'jimbob', 'param2':37, 'etc':'bluebell' });या:
var result = { referer:'jimbob', param2:37, etc:'bluebell' };
$state.go('toState', result);और इसी तरह HTML में:
<a ui-sref="toState(thingy)" class="list-group-item" ng-repeat="thingy in thingies">{{ thingy.referer }}</a>यह उपयोग का मामला पूरी तरह से प्रलेखन में उजागर किया गया है, लेकिन मुझे लगता है कि यह URL का उपयोग किए बिना राज्य को परिवर्तित करने का एक शक्तिशाली साधन है।
{referer: true, param2: true, etc: true}
नाथन मैथ्यू का समाधान मेरे लिए काम नहीं करता था, लेकिन यह पूरी तरह से सही है, लेकिन वर्कअराउंड तक पहुंचने के लिए बहुत कम बिंदु हैं:
मुख्य बिंदु यह है: राज्य के संक्रमण के दोनों किनारों पर परिभाषित पैरामीटर और $ state.go के toParamas समान सरणी या ऑब्जेक्ट होना चाहिए।
उदाहरण के लिए जब आप किसी राज्य में एक परिमों को परिभाषित करते हैं, तो इसका मतलब है कि "[]" का उपयोग करने के कारण आपको परिंदों को सरणी करना है:
$stateProvider
.state('home', {
templateUrl: 'home',
controller: 'homeController'
})
.state('view', {
templateUrl: 'overview',
params: ['index', 'anotherKey'],
controller: 'overviewController'
})तो आप भी इस तरह सरणी के रूप में toParams पास करना चाहिए:
params = { 'index': 123, 'anotherKey': 'This is a test' }
paramsArr = (val for key, val of params)
$state.go('view', paramsArr)और आप इस तरह से सरणी के रूप में $ राज्यप्रेम के माध्यम से उन्हें एक्सेस कर सकते हैं:
app.controller('overviewController', function($scope, $stateParams) {
var index = $stateParams[0];
var anotherKey = $stateParams[1];
});बेहतर समाधान दोनों पक्षों में सरणी के बजाय ऑब्जेक्ट का उपयोग कर रहा है :
$stateProvider
.state('home', {
templateUrl: 'home',
controller: 'homeController'
})
.state('view', {
templateUrl: 'overview',
params: {'index': null, 'anotherKey': null},
controller: 'overviewController'
})मैंने params की परिभाषा में {} को बदल दिया। ToParams को $ state.go में पास करने के लिए आपको सरणी के बजाय ऑब्जेक्ट का उपयोग करना चाहिए:
$state.go('view', { 'index': 123, 'anotherKey': 'This is a test' })तब आप उन्हें $ राज्यप्रेम के माध्यम से आसानी से एक्सेस कर सकते हैं:
app.controller('overviewController', function($scope, $stateParams) {
var index = $stateParams.index;
var anotherKey = $stateParams.anotherKey;
});params: {'index', 'anotherKey'},साथ params: {'index' : 'dummy', 'anotherKey' : 'dummy'},अन्यथा यह एक मान्य जावास्क्रिप्ट वस्तु नहीं है
मुझे बस इतना करना था कि url राज्य की परिभाषा में एक पैरामीटर जोड़ा जाए
url: '/toState?referer'रवींद्र!
/toState/:refererसिंटैक्स के साथ काम करने का एकमात्र तरीका $location.path()इसके बजाय उपयोग करना है $state.go()।
निश्चित नहीं है कि यह ular- रूटर v0.2.0 के साथ AngularJS v1.2.0-rc.2 के साथ काम करेगा। मैंने ui- राउटर v0.2.13 के साथ AngularJS v1.3.14 पर इस समाधान का परीक्षण किया है।
मुझे बस एहसास है कि URL में पैरामीटर को पास करना आवश्यक नहीं है क्योंकि gwhn अनुशंसा करता है।
बस अपने राज्य की परिभाषा पर एक डिफ़ॉल्ट मान के साथ अपने पैरामीटर जोड़ें। आपके राज्य में अभी भी एक यूआरएल मान हो सकता है।
$stateProvider.state('state1', {
url : '/url',
templateUrl : "new.html",
controller : 'TestController',
params: {new_param: null}
});और करने के लिए परम जोड़ें $state.go()
$state.go('state1',{new_param: "Going places!"});इस पृष्ठ पर इनमें से किसी भी उदाहरण ने मेरे लिए काम नहीं किया। यह वही है जो मैंने इस्तेमाल किया और इसने अच्छा काम किया। कुछ समाधानों में कहा गया है कि आप url को $ state.go () के साथ जोड़ नहीं सकते, लेकिन यह सच नहीं है। अजीब बात है कि आप यूआरएल के लिए params परिभाषित करना चाहिए और भी params सूची। दोनों को उपस्थित होना चाहिए। Angular 1.4.8 और UI राउटर 0.2.15 पर परीक्षण किया गया।
राज्य में राज्य के अंत में अपने परिमों को जोड़ें और परिमों को परिभाषित करें:
url: 'view?index&anotherKey',
params: {'index': null, 'anotherKey': null}आपके नियंत्रक में आपका विवरण इस तरह दिखेगा:
$state.go('view', { 'index': 123, 'anotherKey': 'This is a test' });फिर अपने नए राज्य के नियंत्रक में पैरामेट्स को बाहर निकालने और उनका उपयोग करने के लिए (अपने राज्य के कार्यों के लिए $ $ राज्यप्रेम में पास करना न भूलें):
var index = $stateParams.index;
var anotherKey = $stateParams.anotherKey;
console.log(anotherKey); //it works!मेरे मामले में मैंने यहां दिए गए सभी विकल्पों के साथ प्रयास किया, लेकिन कोई भी ठीक से काम नहीं कर रहा था (कोणीय 1.3.13, आयनिक 1.0.0, कोणीय-यूआई-राउटर 0.2.13)। समाधान था:
.state('tab.friends', {
url: '/friends/:param1/:param2',
views: {
'tab-friends': {
templateUrl: 'templates/tab-friends.html',
controller: 'FriendsCtrl'
}
}
})और राज्य में।
$state.go('tab.friends', {param1 : val1, param2 : val2});चियर्स
मैंने Ionic / Angular's $ state & $ StateParams के साथ लड़ाई में अच्छा समय बिताया है;
$ State.go () और $ StateParams का उपयोग करने के लिए आपके पास कुछ चीजें होनी चाहिए सेटअप और अन्य पैरामीटर मौजूद नहीं होने चाहिए।
मेरे app.config () में मैंने $ StateProvider शामिल किया है और इसे कई राज्यों में परिभाषित किया है:
$stateProvider
.state('home', {
templateUrl: 'home',
controller: 'homeController'
})
.state('view', {
templateUrl: 'overview',
params: ['index', 'anotherKey'],
controller: 'overviewController'
})paramsकुंजी विशेष रूप से महत्वपूर्ण है। साथ ही, सूचना है कि कोई भी urlकुंजी मौजूद नहीं है ... स्टेटपरम्स और यूआरएल का उपयोग नहीं करते हैं। वे परस्पर एक दूसरे के अनन्य हैं।
$ State.go () कॉल में, इसे इस प्रकार परिभाषित करें:
$state.go('view', { 'index': 123, 'anotherKey': 'This is a test' })indexऔर anotherKeyअगर वे पहले $ stateController में सूचीबद्ध हैं $ stateParams चर केवल से भरी हुई होगी paramsपरिभाषित करने कुंजी।
नियंत्रक के भीतर, सचित्र रूप में $ राज्यप्रेम शामिल करें:
app.controller('overviewController', function($scope, $stateParams) {
var index = $stateParams.index;
var anotherKey = $stateParams.anotherKey;
});पारित चर उपलब्ध होना चाहिए!
reload: true?यह पता नहीं लगा सका कि सबसे लंबे समय तक क्या चल रहा था - पता चला कि मैं खुद को बेवकूफ बना रहा था। यदि आप निश्चित हैं कि चीजें सही ढंग से लिखी गई हैं और आप उसी स्थिति का उपयोग करेंगे, तो कोशिश करें reload: true:
.state('status.item', {
url: '/:id',
views: {...}
}
$state.go('status.item', { id: $scope.id }, { reload: true });आशा है कि यह आपको समय बचाता है!
मुझे भी इसी तरह की समस्या का सामना करना पड़ा। मैंने बहुत सारे गुगली और परीक्षण और परीक्षण के बाद एक कार्य समाधान के साथ समाप्त किया। यहाँ मेरा समाधान है जो आपके लिए काम करेगा।
मेरे पास दो नियंत्रक हैं - searchBoxController और stateResultController और एक पैरामीटर जिसका नाम searchQuery है एक दृश्य के परिणाम दिखा एक दूरस्थ सर्वर से लाना एक दृश्य के लिए एक खोज बॉक्स होने से पारित होने के लिए। इसे आपको इसी तरह करना होगा:
नीचे नियंत्रक है जिससे आप अगले दृश्य का उपयोग करके कॉल करते हैं $state.go()
.controller('searchBoxController', function ($scope, $state) {
$scope.doSearch = function(){
var searchInputRaw = $scope.searchQueryInput;
$state.go('app.searchResults', { searchQuery: searchInput });
}
})नीचे वह स्थिति है जिसे $state.go()निष्पादित होने पर बुलाया जाएगा :
.state('app.searchResults',
{
url: '/searchResults',
views:
{
'menuContent': { templateUrl: 'templates/searchResult.html', controller: 'stateResultController' }
},
params:
{
'searchQuery': ''
}
})और अंत में, app.searchResultsराज्य से जुड़ा नियंत्रक :
.controller('stateResultController', function ($scope, $state, $stateParams, $http) {
$scope.searchQueryInput = $stateParams.searchQuery;
});और मेरे माता-पिता / बच्चे के राज्य के मामले में। बाल अवस्था में घोषित सभी मापदंडों को मूल स्थिति से जाना जाता है
.state('full', {
url: '/full',
templateUrl: 'js/content/templates/FullReadView.html',
params: { opmlFeed:null, source:null },
controller: 'FullReadCtrl'
})
.state('full.readFeed', {
url: '/readFeed',
views: {
'full': {
templateUrl: 'js/content/templates/ReadFeedView.html',
params: { opmlFeed:null, source:null },
controller: 'ReadFeedCtrl'
}
}
})हम जिस राज्य में 2 पैरामीटर ले गए थे उसका समाधान बदल रहा था:
.state('somestate', {
url: '/somestate',
views: {...}
}सेवा
.state('somestate', {
url: '/somestate?id=:&sub=:',
views: {...}
}रूटर.जेएस में आपका परिभाषित
$stateProvider.state('users', {
url: '/users',
controller: 'UsersCtrl',
params: {
obj: null
}
})आपके नियंत्रक को $ स्थिति जोड़ने की आवश्यकता है।
function UserCtrl($stateParams) {
console.log($stateParams);
}आप निम्नानुसार पैरामीटर द्वारा एक वस्तु भेज सकते हैं।
$state.go('users', {obj:yourObj});मैं पेज 1 से 2 तक नेविगेट करने की कोशिश कर रहा था, और मुझे कुछ डेटा भी पास करना था।
मेरे राऊटर.जेएस में , मैंने नाम और उम्र जोड़ी है :
.state('page2', {
url: '/vehicle/:source',
params: {name: null, age: null},
.................में पृष्ठ 1 , अगले बटन के onClick:
$state.go("page2", {name: 'Ron', age: '20'});में पृष्ठ 2 , मैं उन पैरामीटर पहुंच सकता है:
$stateParams.name
$stateParams.ageयदि यह एक क्वेरी पैरामीटर है जिसे आप इस तरह से पास करना चाहते हैं:
/toState?referer=current_user
फिर आपको इस तरह अपने राज्य का वर्णन करने की आवश्यकता है:
$stateProvider.state('toState', {
url:'toState?referer',
views:{'...'}
});स्रोत: https://github.com/angular-ui/ui-router/wiki/URL-Rout#query-parameters
paramsसरणी में शामिल करने की आवश्यकता है।