AngularJS
Совместное использование данных
Поиск…
замечания
Очень распространенный вопрос при работе с 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, как это.