কন্ট্রোলারে ইউআই-রাউটারে ui-sref ব্যবহার করে প্যারামিটারগুলি কীভাবে পাস হবে

369

আমি ui-srefইউআই-রাউটারের সাহায্যে ট্রানজিট করতে চাইলে আমাকে দুটি পরামিতিগুলি পাস এবং পুনরায় গ্রহণ করতে হবে ।

রাজ্যটি homeসাথে fooএবং barপরামিতিগুলিতে রূপান্তর করার জন্য নীচের লিঙ্কটি ব্যবহার করার মতো কিছু :

<a ui-sref="home({foo: 'fooVal', bar: 'barVal'})">Go to home state with foo and bar parameters </a>

একটি নিয়ামক মধ্যে প্রাপ্ত fooএবং barমান:

app.controller('SomeController', function($scope, $stateParam) {
  //..
  var foo = $stateParam.foo; //getting fooVal
  var bar = $stateParam.bar; //getting barVal
  //..
});

আমি পেতে undefinedজন্য $stateParamনিয়ামক হবে।

এটি কীভাবে করা যায় তা বুঝতে কেউ আমাকে সহায়তা করতে পারে?

সম্পাদনা:

.state('home', {
  url: '/',
  views: {
    '': {
      templateUrl: 'home.html',
      controller: 'MainRootCtrl'

    },

    'A@home': {
      templateUrl: 'a.html',
      controller: 'MainCtrl'
    },

    'B@home': {
      templateUrl: 'b.html',
      controller: 'SomeController'
    }
  }

});

— লাফালাফি করা
সূত্র

আপনার সেগুলি আপনার রুটেও স্থাপন করতে হবে। উদা: - url:'.../home/:foo/:bar

— পিএসএল

@ পিএসএল: আপনি কি এখানে একটি ছোট উদাহরণ দিতে পারেন? ধন্যবাদ।

— লাফালাফি

@ পিএসএল: ধন্যবাদ পিএসএল, কোনও নিয়ামকতে আমি তাদের মানগুলির সাথে এই পরামিতিগুলি পেতে পারি এমন অন্য কোনও উপায় আছে?

— লাফালাফি

কি '/:foo/:bar': {আপনার ফাঁকা রুট অথবা ভাল হিসাবে আপনি querystring হিসাবে সেট আপ করতে পারেন।

— পিএসএল

উত্তর:

531

কীভাবে তা দেখানোর জন্য আমি একটি উদাহরণ তৈরি করেছি । আপডেট stateসংজ্ঞাটি হবে:

  $stateProvider
    .state('home', {
      url: '/:foo?bar',
      views: {
        '': {
          templateUrl: 'tpl.home.html',
          controller: 'MainRootCtrl'

        },
        ...
      }

এবং এটি নিয়ামক হবে:

.controller('MainRootCtrl', function($scope, $state, $stateParams) {
    //..
    var foo = $stateParams.foo; //getting fooVal
    var bar = $stateParams.bar; //getting barVal
    //..
    $scope.state = $state.current
    $scope.params = $stateParams; 
})

আমরা যা দেখতে পাচ্ছি তা হল রাজ্যের বাড়ির এখন ইউআরএল সংজ্ঞায়িত হয়েছে:

url: '/:foo?bar',

যার অর্থ, ইউআরএল মধ্যে প্যারামগুলি যেমন প্রত্যাশিত

/fooVal?bar=barValue

এই দুটি লিঙ্ক সঠিকভাবে নিয়ামকের মধ্যে যুক্তিগুলি পাস করবে:

<a ui-sref="home({foo: 'fooVal1', bar: 'barVal1'})">
<a ui-sref="home({foo: 'fooVal2', bar: 'barVal2'})">

এছাড়াও, নিয়ামক $stateParamsপরিবর্তে গ্রাস করে $stateParam।

দস্তাবেজের লিঙ্ক:

ইউআরএল পরামিতি

আপনি এটি এখানে পরীক্ষা করতে পারেন

`params : {}`

এছাড়াও নতুন , আরও দানাদার সেটিং আছে params : {}। আমরা ইতিমধ্যে দেখেছি, আমরা অংশ হিসাবে পরামিতি ঘোষণা করতে পারেন url। তবে params : {}কনফিগারেশন সহ - আমরা এই সংজ্ঞাটি প্রসারিত করতে পারি এমনকি এমন পরামিতিগুলিও প্রবর্তন করতে পারি যা url এর অংশ নয়:

.state('other', {
    url: '/other/:foo?bar',
    params: { 
        // here we define default value for foo
        // we also set squash to false, to force injecting
        // even the default value into url
        foo: {
          value: 'defaultValue',
          squash: false,
        },
        // this parameter is now array
        // we can pass more items, and expect them as []
        bar : { 
          array : true,
        },
        // this param is not part of url
        // it could be passed with $state.go or ui-sref 
        hiddenParam: 'YES',
      },
    ...

প্যারামের জন্য উপলভ্য সেটিংস $ statePovider এর নথিতে বর্ণিত আছে

নীচে কেবল একটি নির্যাস দেওয়া আছে

মান - {অবজেক্ট | ফাংশন =} : এই প্যারামিটারের জন্য ডিফল্ট মান নির্দিষ্ট করে। এটি সুস্পষ্টভাবে এই প্যারামিটারটিকে alচ্ছিক হিসাবে সেট করে ...
অ্যারে - {বুলিয়ান =}: (ডিফল্ট: মিথ্যা) সত্য হলে, পরম মানটিকে মানগুলির একটি অ্যারে হিসাবে বিবেচনা করা হবে।
স্কোয়াশ - {bool | স্ট্রিং =}: স্ক্র্যাশটি কনফিগার করে যে বর্তমান প্যারামিটার মানটি ডিফল্ট মানের সমান হলে ডিফল্ট প্যারামিটার মানটি কীভাবে ইউআরএলে প্রতিনিধিত্ব করা হয়।

আমরা এই প্যারামগুলিকে এভাবে কল করতে পারি:

// hidden param cannot be passed via url
<a href="#/other/fooVal?bar=1&amp;bar=2">
// default foo is skipped
<a ui-sref="other({bar: [4,5]})">

এখানে কর্মে এটি পরীক্ষা করুন

— রদিম কাহলার
সূত্র

দুর্দান্ত উত্তর তবে আমি যদি এর মতো কিছু করতে চাই তবে কী হবে - <a ui-sref="profile.dashboard({aintUserId: [{{ibusUser.icdoUser.idoUser.userId}} })"> এটি কাজ করে না। আমি কীভাবে এটি কাজ করতে পারি?

— ফাহাদ মোল্লাজি

@Radim, আপনি কটাক্ষপাত করা করতে পারেন stackoverflow.com/questions/41429784/... এবং আমাকে সাহায্য একটি বিট

— user203687

এটি সত্যিই সহায়ক ছিল! এই পোস্ট করার জন্য আপনাকে ধন্যবাদ।

— শওকত মির্জা

দুর্দান্ত উত্তর, এটি সত্যিই সহায়ক। ধন্যবাদ!

— ভেঙ্কট

আপনি এর মতো ইউআরএলও রাখতে পারেন:url: "/:id?foo&bar"

— চিকেন স্যুপ

107

অগত্যা আপনার ইউআরএল এর ভিতরে প্যারামিটার থাকতে হবে না।

উদাহরণস্বরূপ, এর সাথে:

$stateProvider
.state('home', {
  url: '/',
  views: {
    '': {
      templateUrl: 'home.html',
      controller: 'MainRootCtrl'

    },
  },
  params: {
    foo: null,
    bar: null
  }
})

আপনি কোনওটি ব্যবহার করে রাজ্যে পরামিতি প্রেরণ করতে সক্ষম হবেন:

$state.go('home', {foo: true, bar: 1});
// or
<a ui-sref="home({foo: true, bar: 1})">Go!</a>

অবশ্যই, আপনি যদি পৃষ্ঠাটিতে একবার homeরাজ্যে পুনরায় লোড করেন তবে আপনি রাষ্ট্রের পরামিতিগুলি আলগা করে দেবেন, কারণ সেগুলি কোথাও সঞ্চিত নয়।

বিভাগের সারি অধীনে এই আচরণের একটি সম্পূর্ণ বিবরণ এখানে দলিলযুক্ত।paramsstate(name, stateConfig)

— পল মৃগেল
সূত্র

পরম বৈশিষ্ট্য, আমার জন্য খুব সুন্দর কাজ করেছে !!!!!! ধন্যবাদ !! আপনি একজন গুগল অভিজ্ঞ

— লুকাশ

আপনি কেবল ভুল বানান করেছেন $stateParam, এটি হওয়া উচিত $stateParams(একটি গুলি দিয়ে)। এজন্য আপনি অপরিশোধিত হন;)

— felixfbecker
সূত্র

সাধারণত এটি প্রশ্নের একটি মন্তব্য হিসাবে যাওয়া উচিত। তবে যাইহোক প্রশ্নটি পড়তে এবং সমস্যা বোঝার জন্য গৃহীত প্রচেষ্টার জন্য +1 :)

— আনমল সরফ