Angularjs, попутная область между маршрутами

scope routes angularjs controllers

67966 просмотра

3 ответа

У меня есть ситуация с формой, которая растягивается на несколько страниц (не может быть идеальным, но это так). Я хотел бы иметь одну область для всей формы, которая заполняется по мере продвижения, чтобы, если пользователь переключался между шагами назад и назад, было легко запомнить состояние.

Так что мне нужно сделать в очень-псевдокоде:

  1. Установлен $scope.val = <Some dynamic data>
  2. Нажмите на ссылку и перейдите к новому шаблону (возможно, с тем же контроллером).
  3. $scope.val должно быть того же значения, что и на последней странице.

Является ли каким-то образом сохранение данных для объема правильным способом или есть какой-то другой путь? Можете ли вы даже создать контроллер, который имеет постоянную область действия между маршрутами, за исключением, конечно, сохранения его в базе данных.

Автор: Erik Honn Источник Размещён: 12.11.2019 09:40

Ответы (3)

138 плюса

Решение

Вам необходимо использовать службу, поскольку она будет сохраняться в течение всей жизни вашего приложения.

Допустим, вы хотите сохранить данные, относящиеся к пользователю

Вот как вы определяете сервис: 

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";

    });
Автор: ganaraj Размещён: 14.12.2012 04:15

9 плюса

Служба будет работать, но логичным способом сделать это, используя только обычные области и контроллеры, является настройка ваших контроллеров и элементов так, чтобы они отражали структуру вашей модели. В частности, вам нужен родительский элемент и контроллер, которые устанавливают родительскую область. Отдельные страницы формы должны находиться в представлении, которое является дочерним по отношению к родителю. Родительская область сохраняется даже при обновлении дочернего представления.

Я предполагаю, что вы используете ui-router, поэтому вы можете иметь вложенные именованные представления. Тогда в псевдокоде:

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

Затем WizardController определяет переменные области действия, которые вы хотите сохранить на всех этапах многостраничной формы (которую я называю «волшебником»). Тогда ваши маршруты будут обновляться stepViewтолько. Каждый шаг может иметь свои собственные шаблоны, контроллеры и области, но их области теряются со страницы на страницу. Но области действия в WizardController сохраняются на всех страницах.

Чтобы обновить области действия WizardController из дочерних контроллеров, вам необходимо использовать синтаксис, подобный $scope.$parent.myProp = 'value'или определяющий функцию setMyPropв WizardController для каждой переменной области действия. В противном случае, если вы попытаетесь установить родительские переменные области непосредственно из дочерних контроллеров, вы в конечном итоге просто создадите новую переменную области действия на самом дочернем элементе, скрывая родительскую переменную.

Трудно объяснить, и я прошу прощения за отсутствие полного примера. По сути, вам нужен родительский контроллер, который устанавливает родительскую область, которая будет сохраняться на всех страницах вашей формы.

Автор: tksfz Размещён: 04.06.2014 10:37

5 плюса

Данные могут передаваться между контроллерами двумя способами

  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"
}

Надеюсь это поможет.

Автор: DILIP KOSURI Размещён: 09.05.2016 03:06
Вопросы из категории :
32x32