Angularjs,传球路线之间范围(Angularjs, passing scope betwee

2019-07-05 07:41发布

我跟那绵延几页表格的情况(可能不理想,但这是它是如何)。 我想有该被填写为您去整个形成一个范围,所以,如果用户往返步骤之间很容易记住的状态。

所以,我需要做的,在很伪代码:

  1. 集合$scope.val = <Some dynamic data>
  2. 点击一个链接,被路由到一个新的模板(可能使用相同的控制器)。
  3. $scope.val仍然应该是相同的值,因为它是在最后一页上。

对于范围是某种持久化数据去了解这个正确的方式,或者是有一些其他的方式? 你甚至可以创建具有路由之间的持久范围内,除为拯救它当然是一个数据库的控制器。

Answer 1:

你需要使用一个服务,因为服务在您的应用程序的生命将持续存在。

比方说,你要保存有关用户数据

这是你如何定义服务:

app.factory("user",function(){
        return {};
});

在您的第一个控制器:

app.controller( "RegistrationPage1Controller",function($scope,user){
    $scope.user = user;
    // and then set values on the object
    $scope.user.firstname = "John";
    $scope.user.secondname = "Smith";
});

app.controller( "RegistrationSecondPageController",function($scope,user){
        $scope.user = user;
        // and then set values on the object
        $scope.user.address = "1, Mars";

    });


Answer 2:

该服务将正常工作,但只使用普通的范围和控制器做一个合理的方式是设置你的控制器和元素,以便它反映了模型的结构。 特别是,你需要的是建立一个父范围父元素和控制器。 形式的个人网页应该驻留在认为是孩子家长。 父范围仍然存在,甚至是孩子视图更新。

我假设你正在使用的UI路由器让您可以嵌套命名视图。 然后,在伪代码:

<div ng-controller="WizardController">
  <div name="stepView" ui-view/>
</div>

然后WizardController定义要跨越多页形式的步骤(这我指的是作为“向导”)保存变量的作用域。 然后,你的路线将更新stepView只。 每一步都可以有自己的模板,控制器和范围,但其范围是从页丢失的页面。 但在WizardController的范围所有网页保存下来。

要更新从子控制器WizardController范围,你需要使用类似语法$scope.$parent.myProp = 'value'或定义一个函数setMyProp上WizardController每个作用域变量。 否则,如果你试图直接从孩子控制器设置父范围的变量,你最终只是创造对孩子本身就是一个新的作用域变量,阴影父变量。

硬种解释,我为缺乏一个完整的例子道歉。 基本上你想要的是建立一个父范围,这将在您的表单的所有页面保存父控制器。



Answer 3:

该数据可以在控制器之间通过两种方式传递

  1. $rootScope
  2. 模型

下面的示例演示值的使用模型的通过

app.js

angular.module('testApp')
  .controller('Controller', Controller)
  .controller('ControllerTwo', ControllerTwo)
  .factory('SharedService', SharedService);

SharedService.js

function SharedService($rootScope){

 return{
    objA: "value1",
    objB: "value2"
  }
}

//修改在控制器A中的值

Controller.js

function Controller($scope, SharedService){

 $scope.SharedService = SharedService;

 $scope.SharedService.objA = "value1 modified";
}

//访问在controllertwo值

ControllerTwo.js

function ControllerTwo($scope, SharedService){

 $scope.SharedService = SharedService;

 console.log("$scope.SharedService.objA"+$scope.SharedService.objA); // Prints "value1 modified"
}

希望这可以帮助。



文章来源: Angularjs, passing scope between routes