moduł nadrzędny jako zależność

Question

Moja aplikacja ma kątowy moduł:

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

Moduł posiada również usługę zrealizować rzeczy, wejście/wyjście:

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

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

Później chcę, aby przechowywać zmienna dataStore z JSON w pliku jako obiekcie.

Teraz mam iframe w mojej aplikacji do wyświetlania niektórych treści z kartami, można nazwać to jak coś w rodzaju przeglądarki.

Aby umożliwić ustawienie niektórych ustawień, chciałem zrobić to w jednym elemencie iframe. W celu zapisania danych do pliku, muszę zadzwonić do IO_Service, który znajduje się w aplikacji nadrzędnej

W moim iframe Mam moduł:

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

z kontrolerem

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

Muszę więc zadeklarować zależność dla modułu nadrzędnego, aby użyć funkcji ioService w celu wywołania funkcji pushData.

Czy ktoś ma kilka wskazówek, aby uświadomić to sobie?

Answer 1

Wszystko, co powinieneś zrobić, to pozwolić modułowi ustawień wiedzieć, że jest zależne od modułu operacyjnego IO, a kiedy już to zrobisz, możesz po prostu użyć usługi IO tak, jakby była w tym samym module, tak jak:

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

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

Answer 2

Wszystko DoctorMick says here jest poprawne i musi zostać wykonane, aby uzyskać dostęp do usługi w kontrolerze.

Dodatkowo, trzeba zająć się tym, że rodzic i iframe nie udostępnia żadnych kontekst javascript:

o tej samej domeny Odpowiedź

W module, dataStore musi być window.dataStore lub window.parent.dataStore (ewentualnie window.top.datastore) w zależności od przypadku, gdy moduł jest ładowana do ramka lub jako stronie głównej:

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]; 
     } 
    }; 
}); 

Albo coś w tym stylu. Zasadniczo, sprawdź, czy jesteś załadowany do elementu iframe lub elementu nadrzędnego, a następnie dołącz do własnego (jako rodzica) dataStore lub do rodzica: dataStore.

The Cross-Domain Odpowiedź

Głównym ramki iframe i są całkowicie niezależne - są równie dobrze może (prawie) dwa różne zakładki przeglądarek - żeby nie dzielić wszystko z perspektywy danych Javascript . Bez użycia jakiejś biblioteki komunikacyjnej iframe lub przy użyciu api (może za pośrednictwem WebSockets?) w celu utworzenia kopii zapasowej, nie będziesz w stanie uzyskać połączenia między dwiema ramkami.

Jeśli ponownie rozważysz swój problem jako dwie różne aplikacje - "kontener przeglądarki" i zbiór "przeglądarek" - i poszukaj odpowiedniej komunikacji między aplikacjami, co może pomóc.

Bardziej konkretnie, zakładając chcesz rozwiązania po stronie klienta, a twoi pushData(key, value)getData(key) metody w ioService wystarczy owinąć mechanizm komunikacyjny zbudowany przy użyciu zarówno rodzimy Window.postMessage API lub biblioteka jak postmessage lub porthole.