AngularJs связь с одной страницы на другую

-1

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

JavaScript код

var app = angular.module("appLive", []); 
app.factory('SharedService', function($rootScope) { 
    var something; 
    var setSomething = function(something) { 
     this.something = something; 
    } 
    var getSomething = function() { 
     return something; 
    } 
    return { 
     setSomething: setSomething, 
     getSomething: getSomething 
    } 
}); 
app.controller("CTRL1", function($scope, SharedService) { 
    $scope.transfer = function(value) { 
     SharedService.setSomething(value) 
     console.log("Value Transfered") 
    } 
}); 
app.controller("CTRL2", function($scope, SharedService) { 
    $scope.initFunction = function() { 
     $scope.message = SharedService.getSomething(); 
    } 
});

HTML Page 1

<html> 
    <head> 
     <title>Angular Communication Page 1</title> 
     <SCRIPT src = "http://ajax.googleapis.com/ajax/libs/angularjs/1.2.17/angular.js"></SCRIPT> 
     <script src = "JavaScriptCode.js"></script> 
    </head> 
    <body> 
     <div ng-app = "appLive" ng-controller="CTRL1"> 
      <input type = "text" ng-model = "dataInput"> 
      <br><br> 
      <button ng-click = "transfer(dataInput)">Transfer the value</button> 
     </div> 
    </body> 
</html>

HTML Page 2

<html> 
    <head> 
     <title>Angular Communication Page 2</title> 
     <SCRIPT src= "http://ajax.googleapis.com/ajax/libs/angularjs/1.2.17/angular.js"></SCRIPT> 
     <script src = "OnlineJavaScriptCode.js"></script> 
    </head> 
    <body> 
     <div ng-app = "myModule" ng-controller="ControllerOne" ng-init = "initFunction()"> 
      <input type = "text" ng-model = "message"> 
      <br><br> 
      {{message}} 
     </div> 
    </body> 
</html>

источник

2017-02-19 Angkirat Sandhu

добавить маршрутизацию в нее сейчас или использовать ng-hide/ng-show –

У вас есть две разделенные страницы с двумя основными модулями, тогда вам нужно использовать localStorage для получения переменной с одной страницы на другую. Вы можете создать службу, которая будет читать/записывать localStorage, которая будет использоваться двумя страницами. – jcubic

Я не против Использование localStorage, поскольку в основном проекте мне нужно использовать несколько серверов для работы. Я попытался создать глобальную переменную вне класса модуля, но даже это не сработало. –

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

для того, чтобы перемещаться между двумя различными видами (страницы) вы должны использовать угловые ngRoute/ui-router модули.

Если вы пытаетесь передать данные от одного домена к другому вы должны делать это через сервер, а не клиент.

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

Если вы находитесь в том же домене, вы можете использовать localStorage или sessionStorage.

источник

2017-02-19 13:14:35

Отвечая на ваш точный вопрос, вы можете использовать localStorage для обмена данными между двумя страницами в одном домене (и если у вас есть два домена, вы можете прочитать this article).

Вы можете создать службу, которая будет использоваться в обеих страницах (входит в обоих модулей):

var module = angular.module('common', []); 
module.factory('SharedService', function() { 
    return { 
     setSomething = function(value) { 
      localStorage.setItem('something', value); 
     }, 
     getSomething = function() { 
      return localStorage.getItem('something'); 
     } 
    }; 
});

, и вы можете использовать этот модуль в обеих страницах:

angular.module("appLive", ['common']); 


angular.module("myModule", ['common']);

если вы открыли эти две страницы на двух вкладках и хотите отправить переменную с одной страницы на другую (так что переменная сообщения заполняется при вызове передачи), тогда вам нужно будет использовать событие хранения, или вы можете использовать sysend.js library, которые используют это событие для отправки сообщений на другие страницы/вкладки.

Но если вы создаете приложение, вероятно, вы должны использовать одну страницу и один основной модуль и использовать ui-router или ng-route для создания маршрутов, которые будут иметь разный URL-адрес и на основе открытого открытого представления, как описано в @obyFS ,

источник

2017-02-19 14:47:25 jcubic

AngularJs связь с одной страницы на другую

ответ

Смежные вопросы