更新 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 =function(){//某些内容更新了作用域上的 objectX}}.controller('otherChildCtrl',$scope,objectX){//如何获取更新后的对象X?}

提前致谢

解决方案

我不确定我是否能看到问题出在哪里...但是如果您正在寻找一种方法来共享对更新的参考的访问权，应该很容易.有一个例子

让我们拥有这些状态

$stateProvider.state('root', {摘要:真实，模板:'<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 y <input ng-model="data.objectX.y"/>

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

仅按视图层次结构继承范围

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

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屋！