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

App.controller('ProductCtrl',function($scope,$productFactory){
     $productFactory.get().success(function(data){
           $scope.products = data;
     });
});

На мой взгляд, я отображаю эти продукты в списке

<ul>
    <li ng-repeat="product as products">
        {{product.name}}
    </li>
</ul

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

 <ul class="cart">
      <li>
          //click one added here
      </li>
      <li>
          //click two added here
      </li>
 </ul>

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

Я обрабатываю событие click, используя директиву. Также я чувствую, что должен использовать сервис для достижения вышеуказанной функциональности, просто не могу понять, как? потому что в корзине будет предопределенное количество добавленных товаров, может быть 5/10 в зависимости от того, на какой странице находится пользователь. Так что я хотел бы сохранить это общее.

— почти нет время на всех. То есть, говоря системе: «Пожалуйста, вызовите эту функцию после 1000 мельница iseconds «вернется почти сразу, так как процесс установки запроса на тайм-аут в очереди таймера очень быстрый.

Не поддерживается в:

Из описания кажется, что вы должны использовать сервис. Ознакомьтесь с http://egghead.io/lessons/angularjs-sharing-data-between-controllers и Служба AngularJS, передающая данные между контроллерами Вот код объекта

Вы можете определить сервис вашего продукта (как фабрику) следующим образом:

app.factory('productService', function() {
  var productList = [];

  var addProduct = function(newObj) {
      productList.push(newObj);
  };

  var getProducts = function(){
      return productList;
  };

  return {
    addProduct: addProduct,
    getProducts: getProducts
  };

});

внедряет службу в оба контроллера.

В вашей ProductController, определите действие, которое добавляет выбранный объект в массив:

app.controller('ProductController', function($scope, productService) {
    $scope.callToAddToProductList = function(currObj){
        productService.addProduct(currObj);
    };
});

В вашей CartController получите продукты из службы:

app.controller('CartController', function($scope, productService) {
    $scope.products = productService.getProducts();
});

Элементы в массиве хранятся в свойствах. Поскольку имена этих свойств являются числами, и нам часто нужно получать их имя из переменной, мы должны использовать синтаксис скобок для доступа к ним.

При нажатии Может вызвать метод, который вызывает broadcast :

$rootScope.$broadcast('SOME_TAG', 'your value');

, и второй контроллер будет прослушивать этот тег, например:

$scope.$on('SOME_TAG', function(response) {
      // ....
})

Так как мы не можем внедрить $ scope в службы, нет ничего похожего на singleton $ scope.

Но мы можем внедрить $rootScope. Поэтому, если вы сохраняете значение в Сервисе, вы можете запустить оператор $rootScope.$broadcast('SOME_TAG', 'your value'); чтобы решить. И никто другой не может сделать это для вас ;, только вы знаете, каковы ваши потребности. Почти во всех случаях я ценю простой, практичный и универсальный код перед умным и быстрым. То, что вы цените, может отличаться, поэтому выберите то, что вам подходит.

app.service('productService',  function($rootScope) {/*....*/}

. Пожалуйста, ознакомьтесь с хорошей статьей о $ broadcast , $ emit

Решение без создания Service с использованием $ rootScope:

Для совместного использования свойств через контроллеры приложения вы можете использовать Angular $ rootScope. Это еще один вариант обмена данными, чтобы люди знали об этом.

. Предпочтительный способ поделиться некоторыми функциями через Контроллеры — это Сервисы, чтобы прочитать или изменить глобальное свойство, которое вы можете использовать $ rootcope.

var app = angular.module('mymodule',[]);
app.controller('Ctrl1', ['$scope','$rootScope',
  function($scope, $rootScope) {
    $rootScope.showBanner = true;
}]);

app.controller('Ctrl2', ['$scope','$rootScope',
  function($scope, $rootScope) {
    $rootScope.showBanner = false;
}]);

Использование $ rootScope в шаблоне (доступ к свойствам с помощью $ root):

<div ng-controller="Ctrl1">
    <div class="banner" ng-show="$root.showBanner"> </div>
</div>

Это можно сделать двумя способами.

  1. Используя $rootscope, но я не рекомендую это. $rootScope — самая верхняя область. Приложение может иметь только одну $rootScope И вы должны принять к сведению, что это может зависеть от типа элементов массива, так как javascript управляет строками иначе, чем другие примитивные типы, не говоря уже о массивах объектов. Тип может влиять на то, что происходит.

  2. Использование услуг. Вы можете сделать это, разделив сервис между двумя контроллерами. Код для службы может выглядеть следующим образом:

    app.service('shareDataService', function() {
        var myList = [];
    
        var addList = function(newObj) {
            myList.push(newObj);
        }
    
        var getList = function(){
            return myList;
        }
    
        return {
            addList: addList,
            getList: getList
        };
    });
    

    Вы можете видеть мою скрипку говорится, что Глядя на вывод

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

$scope.customer = {};

мы можем использовать свойство

$scope.data = { customer: {} };

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

angular.module('testAppControllers', [])
    .controller('ctrlOne', function ($scope) {
        $scope.$broadcast('test');
    })
    .controller('ctrlTwo', function ($scope) {
        $scope.$on('test', function() {
        });
    });

мы можем хранить данные в сеансе и использовать их в любом месте нашей программы.

$window.sessionStorage.setItem("Mydata",data);

В другом месте

$scope.data = $window.sessionStorage.getItem("Mydata");

Я видел ответы здесь, и он отвечает на вопрос об обмене данными между контроллерами, но что мне делать, если я хочу, чтобы один контроллер уведомил другой о том, что данные были изменены ( без использования трансляции)? ЛЕГКО! Просто используя известный шаблон посетителей:

myApp.service('myService', function() {

    var visitors = [];

    var registerVisitor = function (visitor) {
        visitors.push(visitor);
    }

    var notifyAll = function() {
        for (var index = 0; index < visitors.length;   index)
            visitors[index].visit();
    }

    var myData = ["some", "list", "of", "data"];

    var setData = function (newData) {
        myData = newData;
        notifyAll();
    }

    var getData = function () {
        return myData;
    }

    return {
        registerVisitor: registerVisitor,
        setData: setData,
        getData: getData
    };
}

myApp.controller('firstController', ['$scope', 'myService',
    function firstController($scope, myService) {

        var setData = function (data) {
            myService.setData(data);
        }

    }
]);

myApp.controller('secondController', ['$scope', 'myService',
    function secondController($scope, myService) {

        myService.registerVisitor(this);

        this.visit = function () {
            $scope.data = myService.getData();
        }

        $scope.data = myService.getData();
    }
]);

Таким простым способом один контроллер может обновить другой контроллер, если некоторые данные были обновлены.

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

.controller('CadastroController', ['$scope', 'RouteSharedScope',
    function($scope, routeSharedScope) {
      var customerScope = routeSharedScope.scopeFor('/Customer');
      //var indexScope = routeSharedScope.scopeFor('/');
    }
 ])

Таким образом, если пользователь перейдет к другому пути маршрута, например, «/ Support», общие данные для пути «/ Customer» будут автоматически уничтожены. Но если вместо этого пользователь перейдет к «дочерним» путям, таким как «/ Customer / 1» или «/ Customer / list», область действия не будет уничтожена.

, потому что мне было любопытно, что происходит, когда потребление времени функцией больше, чем длительность интервала. http://plnkr.co/edit/OL8of9

Создайте фабрику в своем модуле и добавьте ссылку на фабрику в контроллере и используйте ее переменные в контроллере, а теперь получите значение данных в другом контроллере с помощью добавляю ссылку куда угодно … * *} Я не знаю, поможет ли это кому-нибудь, но на основе ответа Charx (спасибо!) я создал простой сервис кэширования. Не стесняйтесь использовать, делать ремиксы и делиться:

В одну сторону, используя угловой сервис:

angular.service('cache', function() {
    var _cache, _store, _get, _set, _clear;
    _cache = {};

    _store = function(data) {
        angular.merge(_cache, data);
    };

    _set = function(data) {
        _cache = angular.extend({}, data);
    };

    _get = function(key) {
        if(key == null) {
            return _cache;
        } else {
            return _cache[key];
        }
    };

    _clear = function() {
        _cache = {};
    };

    return {
        get: _get,
        set: _set,
        store: _store,
        clear: _clear
    };
});

https://jsfiddle.net/1w64222q/

var app = angular.module("home", []);

app.controller('one', function($scope, ser1){
$scope.inputText = ser1;
});


app.controller('two',function($scope, ser1){
$scope.inputTextTwo = ser1;
});

app.factory('ser1', function(){
return {o: ''};
});



<div ng-app='home'>

<div ng-controller='one'>
  Type in text: 
  <input type='text' ng-model="inputText.o"/>
</div>
<br />

<div ng-controller='two'>
  Type in text:
  <input type='text' ng-model="inputTextTwo.o"/>
</div>

</div>

1

При нажатии вы можете вызвать метод, который вызывает трансляцию: 5

using $localStorage

app.controller('ProductController', function($scope, $localStorage) {
    $scope.setSelectedProduct = function(selectedObj){
        $localStorage.selectedObj= selectedObj;
    };
});

app.controller('CartController', function($scope,$localStorage) { 
    $scope.selectedProducts = $localStorage.selectedObj;
    $localStorage.$reset();//to remove
});

Попробуйте вручную:

узнайте больше о шаблоне публикации / подписки в angular

$rootScope.$broadcast('SOME_TAG', 'your value');

and the second controller will listen on this tag like:
$scope.$on('SOME_TAG', function(response) {
      // ....
})

Firefox:

using $rootScope:

4

window.sessionStorage.setItem("Mydata",data);
$scope.data = $window.sessionStorage.getItem("Mydata");

Чтобы улучшить решение, предложенное @Maxim с использованием $ broadcast, отправляйте данные без изменений

https://jsfiddle.net/1w64222q/

var app = angular.module("home", []);

app.controller('one', function($scope, ser1){
$scope.inputText = ser1;
});

app.controller('two',function($scope, ser1){
$scope.inputTextTwo = ser1;
});

app.factory('ser1', function(){
return {o: ''};
});

FYIThe $ scope Объект имеет $ emit, $ broadcast, $ onAND. Объект $ rootScope имеет идентичный $ emit, $ broadcast, $ on

Есть три способа сделать это: говорится, что

Чтобы улучшить решение, предложенное @Maxim с использованием $ broadcast, отправляйте данные без изменений

$rootScope.$broadcast('SOME_TAG', 'my variable');

с

$scope.$on('SOME_TAG', function(event, args) {
    console.log("My variable is", args);// args is value of your variable
})

Есть три способа сделать это,

a) использования службы

б) Использование зависимых родительских / дочерних отношений между областями контроллера.

c) В Angular 2.0 ключевое слово «As» будет передавать данные с одного контроллера на другой.

Для получения дополнительной информации с примером, пожалуйста, проверьте ссылку ниже:

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

var custApp = angular.module("custApp", [])
.controller('FirstController', FirstController)
.controller('SecondController',SecondController)
.service('sharedData', SharedData);

FirstController.$inject = ['sharedData'];
function FirstController(sharedData) {
this.data = sharedData.data;
}

SecondController.$inject['sharedData'];
function SecondController(sharedData) {
this.data = sharedData.data;
}

function SharedData() {
this.data = {
    value: 'default Value'
}
}

toDateString

<div ng-controller="FirstController as vm">
<input type=text ng-model="vm.data.value" />
</div>

Второй контроллер

 <div ng-controller="SecondController as vm">
    Second Controller<br>
    {{vm.data.value}}
</div>

Я думаю, что

Это то, что я придумал.

должен использовать $ localStorage. (Работает постоянно)

app.controller('ProductController', function($scope, $localStorage) {
    $scope.setSelectedProduct = function(selectedObj){
        $localStorage.selectedObj= selectedObj;
    };
});

.

app.controller('CartController', function($scope,$localStorage) { 
    $scope.selectedProducts = $localStorage.selectedObj;
    $localStorage.$reset();//to remove
});

Вы также можете добавить

if($localStorage.selectedObj){
    $scope.selectedProducts = $localStorage.selectedObj;
}else{
    //redirect to select product using $location.url('/select-product')
}