AngularJS ui yönlendiricisi, verileri URL olmadan durumlar arasında geçirir

Question 1

Verileri url'de göstermeden iki durum arasında veri aktarma sorunuyla karşı karşıyayım, bu kullanıcı gerçekten bu duruma doğrudan inemeyecek gibi.

Örneğin. İki durumum var "A" ve "B". "A" durumunda bir sunucu çağrısı yapıyorum ve çağrının yanıtını "B" durumuna geçiriyorum. Sunucu çağrısının yanıtı oldukça uzun bir dize mesajıdır, bu yüzden bunu url'de ifşa edemem.

Öyleyse, açısal ui yönlendiricide, url parametrelerini kullanmadan durumlar arasında veri aktarmanın bir yolu var mı?

Question 2

Biz kullanabilirsiniz params, yeni UI-Router özelliği:

API Başvurusu / ui.router.state / $ stateProvider

paramsİsteğe bağlı olarak url'de bildirilen parametreleri yapılandıran veya url olmayan ek parametreleri tanımlayan bir harita. Yapılandırılan her parametre için, parametrenin adına anahtarlanmış bir yapılandırma nesnesi ekleyin.

Şu kısma bakın: " ... veya url olmayan ek parametreleri tanımlar ... "

Yani durum tanımı şöyle olacaktır:

$stateProvider
  .state('home', {
    url: "/home",
    templateUrl: 'tpl.html',
    params: { hiddenOne: null, }
  })

Yukarıda belirtilen belgeden birkaç örnek :

// define a parameter's default value
params: {
  param1: { value: "defaultValue" }
}
// shorthand default values
params: {
  param1: "defaultValue",
  param2: "param2Default"
}

// param will be array []
params: {
  param1: { array: true }
}

// handling the default value in url:
params: {
  param1: {
    value: "defaultId",
    squash: true
} }
// squash "defaultValue" to "~"
params: {
  param1: {
    value: "defaultValue",
    squash: "~"
  } }

EXTEND - çalışma örneği: http://plnkr.co/edit/inFhDmP42AQyeUBmyIVl?p=info

Durum tanımına bir örnek:

 $stateProvider
  .state('home', {
      url: "/home",
      params : { veryLongParamHome: null, },
      ...
  })
  .state('parent', {
      url: "/parent",
      params : { veryLongParamParent: null, },
      ...
  })
  .state('parent.child', { 
      url: "/child",
      params : { veryLongParamChild: null, },
      ...
  })

Bu, ui-sref kullanan bir çağrı olabilir:

<a ui-sref="home({veryLongParamHome:'Home--f8d218ae-d998-4aa4-94ee-f27144a21238'
  })">home</a>

<a ui-sref="parent({ 
    veryLongParamParent:'Parent--2852f22c-dc85-41af-9064-d365bc4fc822'
  })">parent</a>

<a ui-sref="parent.child({
    veryLongParamParent:'Parent--0b2a585f-fcef-4462-b656-544e4575fca5',  
    veryLongParamChild:'Child--f8d218ae-d998-4aa4-94ee-f27144a61238'
  })">parent.child</a>

Örneğe buradan bakın

Question 3

Params nesnesi $ stateParams'a dahil edilir, ancak url'nin bir parçası olmayacaktır.

1) Rota yapılandırmasında:

$stateProvider.state('edit_user', {
    url: '/users/:user_id/edit',
    templateUrl: 'views/editUser.html',
    controller: 'editUserCtrl',
    params: {
        paramOne: { objectProperty: "defaultValueOne" },  //default value
        paramTwo: "defaultValueTwo"
    }
});

2) Kontrolörde:

.controller('editUserCtrl', function ($stateParams, $scope) {       
    $scope.paramOne = $stateParams.paramOne;
    $scope.paramTwo = $stateParams.paramTwo;
});

3A) Durumun bir kontrolörden değiştirilmesi

$state.go("edit_user", {
    user_id: 1,                
    paramOne: { objectProperty: "test_not_default1" },
    paramTwo: "from controller"
});

3B) html'de Durumu Değiştirme

<div ui-sref="edit_user({ user_id: 3, paramOne: { objectProperty: 'from_html1' }, paramTwo: 'fromhtml2' })"></div>

Örnek Plunker