modulo Parent come dipendenza

Question

La mia applicazione ha un modulo angolare:

var io = angular.module('IO_Operations', []); 

Il modulo dispone anche di un servizio per realizzare le cose di ingresso/uscita:

io.service('ioService', function() { 
    var dataStore = {}; 

    return { 
     pushData: function (key, value) { 
      dataStore[key] = value; 
     }, 
     getData: function (key) { 
      return dataStore[key]; 
     } 
    }; 
}); 

Più tardi mi desidera memorizzare la variabile dataStore con JSON in un file come oggetto.

Ora ho un iframe nella mia aplicazione per visualizzare alcuni contenuti con schede, è possibile chiamarlo qualcosa come un browser.

Per dare la possibilità di effettuare alcune impostazioni, ho voluto farlo in un iframe. Al fine di salvare i dati in un file, ho bisogno di chiamare il IO_Service, che è l'applicazione genitore

Nel mio iframe ho un modulo:

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

con un controller

settings.controller("MyController", function ($scope) { ... } 

Quindi devo dichiarare una dipendenza per il modulo genitore per utilizzare lo ioService per chiamare la funzione pushData.

Qualcuno ha qualche consiglio per me per realizzare questo?

Answer 1

Tutto quello che dovresti fare è lasciare che il modulo delle impostazioni sappia sia dipendente dal modulo operazioni IO e una volta fatto è possibile utilizzare il servizio di I/O come se fosse nello stesso modulo, ad esempio:

var settings = angular.module("settings", ["IO_Operations"]); 

settings.controller("MyController", function ($scope, ioService) { ... } 

Answer 2

Tutto il DoctorMick says here è corretto e deve essere eseguito per accedere al servizio nel controller.

Inoltre, si deve affrontare il fatto che il genitore e iframe non condividono qualsiasi contesto Javascript:

The Same-Domain Risposta

Nel modulo, dataStore deve essere o window.dataStore o window.parent.dataStore (o possibilmente window.top.datastore) a seconda se il modulo è stato caricato in un iframe o come pagina principale:

io.service('ioService', function() { 
    var inIframe = (window.parent !== window); // or (window.top !== window); 

    // If we are in the iframe, we want to use the parent's dataStore, 
    // If we are not in the iframe, we are the parent, so use ours. 
    var dataStore = inIframe ? window.parent.dataStore : window.dataStore; 

    dataStore = dataStore || {}; 

    return { 
     pushData: function (key, value) { 
      dataStore[key] = value; 
     }, 
     getData: function (key) { 
      return dataStore[key]; 
     } 
    }; 
}); 

O qualcosa del genere. Fondamentalmente, capire se si sta caricando nell'iframe o genitore e allegare al proprio (come genitore) dataStore o genitore dataStore.

Il Cross-Domain Risposta

Il telaio principale e l'iframe sono totalmente indipendenti - si potrebbe anche (quasi) due diverse schede del browser - in modo che non condividono nulla dal punto di vista dei dati Javascript . Senza usare qualche tipo di libreria di comunicazione iframe o usando una API (tramite WebSockets, forse?) per eseguire il backup, non sarà possibile ottenere i due frame per comunicare.

Se riconsiderate il vostro problema come due applicazioni distinte - il "contenitore del browser" e una collezione di "browser" - e cercate una comunicazione appropriata tra applicazione e applicazione, ciò potrebbe aiutare.

Più concretamente, supponendo che si desidera una soluzione client-side, i tuoi pushData(key, value) e getData(key) metodi nella ioService solo bisogno di avvolgere un meccanismo di comunicazione costruita utilizzando il nativo Window.postMessage API o una libreria come postmessage o porthole.