如何在angularjs ui-router中的状态之间共享$ scope数据?

如何在angularjs ui-router中的状态之间共享$ scope数据?,第1张

如何在angularjs ui-router中的状态之间共享$ scope数据?

我创建了工作的插件,展示了如何使用

$scope
和UI-Router。

状态定义未更改:

$stateProvider    // States .state("main", {      controller:'mainController',      url:"/main",      templateUrl: "main_init.html"  })    .state("main.1", {      controller:'mainController',      parent: 'main',      url:"/1",      templateUrl: 'form_1.html'  })    .state("main.2", {      controller:'mainController',      parent: 'main',      url: "/2",      templateUrl: 'form_2.html'  })

但是每个状态可以有不同的控制器。为什么?因为每个

view
每个 获得
new
实例
的定义
controller
。因此,尽管我们
mainController
喜欢下面的代码,但可以肯定的是,如果导航到状态
'main.2'
,它将被实例化两次。

controller('mainController', function ($scope) {  $scope.Model = $scope.Model || {Name : "xxx"};})

但是我们可以在这里看到的是,我们检查是否

$scope.Model
已经存在…,如果没有(父状态),则使用 新实例实例 化它
{Name : "xxx"}

好吧,我要说的是:只有父国家才能初始化

$scope.Model
。所有其他人都将得到满足。怎么样?好吧,这就是答案:

仅按视图层次结构的作用域继承

请记住,如果状态的视图是嵌套的,则作用域属性仅沿状态链继承。范围属性的继承与状态的嵌套无关,而与视图(模板)的嵌套无关。

完全有可能存在嵌套状态,这些状态的模板会在站点内各个非嵌套位置填充ui视图。在这种情况下,您不能期望在子状态的视图中访问父状态视图的范围变量。

因此,如文档中所述。因为我们的子视图嵌套在父视图中,所以继承了作用域。

了解范围

在AngularJS中,子作用域通常从其父作用域继承原型。

有一个 ‘。’ 在您的模型中,将确保原型继承在起作用。

// So, use<input type="text" ng-model="someObj.prop1"> // rather than<input type="text" ng-model="prop1">.

就是这样。我们从

UI-Router
视图和角度范围获得继承,并且因为我们巧妙地使用了引用类型(
Model

),即定义中确实包含
'.'
ng-model
-我们现在可以共享数据

注意:点号为“。” 在

ng-model="Model.PropertyName
简单的手段,是有
reference
对象
Model{}
的一些属性:
PropertyName



欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/5509195.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-12-13
下一篇 2022-12-13

发表评论

登录后才能评论

评论列表(0条)

保存