Поиск…


замечания

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

Использование ngStorage для обмена данными

Во-первых, включите источник ngStorage в ваш index.html.

Пример ввода ngStorage src:

<head>
    <title>Angular JS ngStorage</title>
    <script src = "//ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
    <script src="https://rawgithub.com/gsklee/ngStorage/master/ngStorage.js"></script>
</head>

ngStorage дает вам 2 хранилища, а именно: $localStorage и $sessionStorage . Вам нужно будет потребовать ngStorage и Inject services.

Предположим, что если ng-app="myApp" , то вы будете вводить ngStorage следующим образом:

var app = angular.module('myApp', ['ngStorage']);
        app.controller('controllerOne', function($localStorage,$sessionStorage) {
        // an object to share
        var sampleObject = {
            name: 'angularjs',
            value: 1
        };
       $localStorage.valueToShare = sampleObject;
       $sessionStorage.valueToShare = sampleObject;
    })  
.controller('controllerTwo', function($localStorage,$sessionStorage) {
    console.log('localStorage: '+ $localStorage +'sessionStorage: '+$sessionStorage);
})

$localStorage и $sessionStorage доступны глобально через любые контроллеры, если вы вводите эти службы в контроллеры.

Вы также можете использовать localStorage и sessionStorage для HTML5 . Однако, используя HTML5 localStorage , вам потребуется сериализовать и десериализовать объекты перед их использованием или сохранением.

Например:

var myObj = {
    firstname: "Nic",
    lastname: "Raboy",
    website: "https://www.google.com"
} 
//if you wanted to save into localStorage, serialize it  
window.localStorage.set("saved", JSON.stringify(myObj));  

//unserialize to get object  
var myObj = JSON.parse(window.localStorage.get("saved"));

Обмен данными с одного контроллера на другой с помощью службы

Мы можем создать service для set и get данных между controllers а затем ввести эту службу в функцию контроллера, где мы хотим ее использовать.

Обслуживание :

app.service('setGetData', function() {
  var data = '';
    getData: function() { return data; },
    setData: function(requestData) { data = requestData; }
});

Контроллеры:

app.controller('myCtrl1', ['setGetData',function(setGetData) {

  // To set the data from the one controller
  var data = 'Hello World !!';  
  setGetData.setData(data);

}]);

app.controller('myCtrl2', ['setGetData',function(setGetData) {

  // To get the data from the another controller  
  var res = setGetData.getData();
  console.log(res); // Hello World !!

}]);

Здесь мы видим, что myCtrl1 используется для setting данных, а myCtrl2 используется для getting данных. Таким образом, мы можем обмениваться данными с одного контроллера на другой contrller, как это.



Modified text is an extract of the original Stack Overflow Documentation
Лицензировано согласно CC BY-SA 3.0
Не связан с Stack Overflow