insertar - pasar variable blade a javascript

Cómo transferir los datos entre los controladores

Question

Pensé que era anguloso y me enfrenté a un problema: tengo un SPA que contiene dos partes con controladores, los datos retornan del archivo json. El primer conroller para mostrar el menú, el segundo - para agregar un nuevo elemento. Por ahora, en el archivo json hay dos objetos, pero cuando agregué un tercer elemento en el segundo controlador, desapareció cuando volví a la primera página. ¿Cómo puedo arreglarlo? He leído que la fábrica puede transferir los datos entre los controladores, pero nunca lo he usado.

Módulo angular:

var myApp = angular.module("testModule", [''ngRoute'']);

myApp.config(function ($routeProvider){
    $routeProvider.when(''/'', {
        templateUrl: ''pages/main.html'',
        controller: ''mainCtrl''
    })
    .when(''/add'', {
        templateUrl: ''pages/add.html'',
        controller: ''addCtrl''
    })
})



myApp.controller("mainCtrl", function ($scope, $http) {
            $http.get("model/data.json").success(function (response) {
                $scope.list = response;
            })                  

    });

myApp.controller("addCtrl", function ($scope, $http) {

            $scope.addAdv = function(newAdv){
                $http.get("model/data.json").success(function (response) {
                    response.push({
                        name: newAdv.name,
                        shop: newAdv.shop 
                    });
            })
        }; 
    });

Archivo JSON:

[{
    "name": "New Item",
    "shop": "Titan"
},
{
    "name": "New Item1",
    "shop": "Titan"
}]

Answer 1

Como dijo Daniel.v, un servicio es la mejor manera. También hay dos alternativas menos elegantes:

• "si los datos son propiedad de dos controladores, estos deberían compartir un $ parent, ¡y debería ser el propietario de los datos!"
• "oye, ¿por qué no usamos eventos y oyentes? ¡Vamos por $ emisión y $ emisión!"

Pero prefiero principalmente los servicios.

Answer 2

Puede usar servicios angulares para compartir datos entre sus controladores. primero debe crear un servicio para obtener información de su servidor

var app = angular.module(''app'', [''ngRoute'']);
app.service(''dataService'', function($http) {
  var data = {};
    data.list = [];
  var getData = function(){
    $http.get("model/data.json").then(function (response) {
      data.list = response.data;
    },function(err){});

  }
    return {
        getDataFromServer:getData,
        getData:data,

    }
});

Ahora puede usar este servicio en su controlador:

app.controller("mainCtrl", function ($scope, dataService) {
       dataService.getDataFromServer();      

});

app.controller("addCtrl", function ($scope, dataService) {
    $scope.data = dataService.getData;
    $scope.data.list.push({
        name:"foo",
        shop:"bar"
    });
});

Y aquí está el código jsfiddle: https://jsfiddle.net/xqn5yu8g/

Para obtener más información acerca de los servicios angulares, consulte la página de documentos de servicios de angularjs.

Answer 3

1. usar el servicio
2. usuario $ broadcast o $ emit
3. use $ rootScope (no recomendado)

Answer 4

Esto funcionará para ti:

`

<div ng-app="myApp" ng-controller="myCtrl"> 

    <button ng-click="sendData();"></button>

</div>


<script>
    var app = angular.module(''myApp'', []);
    app.controller(''myCtrl'', function($scope, $http) {
        function sendData($scope) {
            var arrayData = [1,2,3];
            $scope.$emit(''someEvent'', arrayData);
        }

    });
    app.controller(''yourCtrl'', function($scope, $http) {
        $scope.$on(''someEvent'', function(event, data) {
            console.log(data); 
        }); 
    });
</script>

`