更新 ui.router 父状态中的已解析对象 [英] Updating resolved objects in ui.router parent states

问题描述

我的问题有两个:

1 - 我有一个父状态和几个使用 ui.router 的子状态，所有状态都需要一个对象(存储在 mongodb 中)，但它会被所有状态更新.在这种情况下，使用父状态的解析选项来填充对象是否有意义?

2 - 如果这是执行此操作的正确方法，我如何将引用"(由 ui.router 创建的模拟服务注入器)从每个状态更新到该对象.

为了帮助解释他是这个想法的一个例子(省略了很多代码)

.state('parent',resolve:{objectX:return x.promise;},...);.controller('childstateCtrl',$scope,objectX){$scope.data.objectX = objectX;$scope.someEvent =函数(){//一些东西更新了作用域上的 objectX}}.controller('otherChildCtrl',$scope,objectX){//如何获取更新后的objectX?}

提前致谢

解决方案

不完全确定我是否可以看到问题出在哪里...但是如果您正在寻找一种方法如何共享对更新的参考/strong>，应该很容易.有一个例子

让我们拥有这些状态

$stateProvider.state('根', {摘要:真实，模板:'<div ui-view></div>',解决: {objectX : function() { return {x : 'x', y : 'y'};}},控制器:'rootController'，}).state('家', {父母:根"，网址:'/家'，templateUrl: 'tpl.example.html',}).state('搜索', {父母:根"，网址:'/搜索'，templateUrl: 'tpl.example.html',}).state('索引', {父母:根"，网址:'/索引'，templateUrl: 'tpl.example.html',})

仅使用一个控制器(对于根状态):

.controller('rootController', function($scope, objectX){$scope.data = { objectX: objectX };})

对于这个例子，这是共享模板:

<h3>{{state.current.name}}</3>x<输入ng-model="data.objectX.x"/>y <输入ng-model="data.objectX.y"/></div>

因此，在这种情况下，父(根)已将对象数据注入 $scope.然后按照此处所述继承该引用:

仅限视图层次结构的范围继承

此处查看该示例.如果您需要更多详细信息(比上面的链接，请查看此Q&A)

My question is two fold:

1 - I have a parent state and several child states using ui.router, there's one object (stored in mongodb) that is need in all states, but it gets updated by all states. In this scenario does it make sense to use the parent state's resolve option to populate the object?

2 - If this is the proper way to do this, how can I update that "reference" (the mock service injector created by the ui.router) to that object from every state.

To help in explain he's a example of the idea (lot's of code ommited)

.state('parent',resolve:{objectX:return x.promise;},...);

.controller('childstateCtrl',$scope,objectX){
    $scope.data.objectX = objectX;
    $scope.someEvent =function(){ 
    // something updates objectX on the scope
    }
}

.controller('otherChildCtrl',$scope,objectX){
    // how to get the updated objectX?
}

Thanks in advance

解决方案

Not fully sure if I can see where is the issue... but if you are searching for a way how to share access to updated reference, it should be easy. There is an example

Let's have these states

$stateProvider
  .state('root', {
    abstract: true,
    template: '<div ui-view></div>',
    resolve: {objectX : function() { return {x : 'x', y : 'y'};}},
    controller: 'rootController',
  })
  .state('home', {
    parent: "root",
    url: '/home',
    templateUrl: 'tpl.example.html',
  })
  .state('search', {
    parent: "root",
    url: '/search',
    templateUrl: 'tpl.example.html',
  })
  .state('index', {
    parent: "root", 
    url: '/index',
    templateUrl: 'tpl.example.html',
  })

Working with only one controller (for a root state):

.controller('rootController', function($scope, objectX){
  $scope.data = { objectX: objectX };
})

And for this example, this is shared template:

<div>
  <h3>{{state.current.name}}</3>

  x <input ng-model="data.objectX.x"/>
  y <input ng-model="data.objectX.y"/>
</div>

So, in this scenario, parent (root) has injected an object data into $scope. That reference is then inherit as described here:

Scope Inheritance by View Hierarchy Only

Check that example in action here. If you need more details (than in the link above, check this Q&A)

这篇关于更新 ui.router 父状态中的已解析对象的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！