2016-07-19 9 views
0

Ich habe einige Variablen & Funktionen in meinem Projekt, das ich auf jeder Seite brauche. Die Daten in Variablen kommen von Cookies & in Funktionen Ich rufe einige Dienste, um die Daten zu bekommen.Zuerst behalte ich sie in einigen Controller & mit $ rootScope für den globalen Zugriff, aber das hat nicht funktioniert, wenn ich die Seite neu laden.So Wo sollte ich diese Variablen & Funktionen halten? Vielen Dank im Vorauswo globale Variablen und Funktionen in angularjs zu halten?

Dies ist die Controller Code-

pkController.controller('domainOneController', [ 
     '$scope', 
     '$cookies', 
     '$route', 
     '$location', 
     '$mdSidenav', 
     '$rootScope', 
     'domainService', 
     'subDomainService', 
     function($scope, $cookies, $route, $location, $mdSidenav, $rootScope, 
       domainService, subDomainService) { 
     /*getting username from cookies to display in dashboard & if not found then redirect to login page*/ 

     $rootScope.role = $cookies.get('role'); 
     $rootScope.userInfo = $cookies.get('login'); 
     $rootScope.id = $cookies.get('id'); 
     $rootScope.isSidenavOpen = false; 

     if ($rootScope.userInfo == undefined 
       || $rootScope.role == undefined) { 
      $location.path("/"); 
     } 
     $rootScope.$route = $route; 

     /*for opening slider*/ 

     $rootScope.openSlider = function() { 

      $mdSidenav('left').toggle(); 
     }; 

     /*getting sub-domains from service & showing sub-domains of first domain on page loading*/ 

     $scope.subDomains = subDomainService.getSubDomain(1); 
     $scope.subDomains.success(function(data, status, headers, config) { 

      $scope.subDomainNames = data.subdomains; 

     }).error(function(data, status, headers, config) { 

     }); 

     /*switching between pages by clicking on slider & updating sub-category*/ 

     $rootScope.redirect = function(id, domain) { 

      $rootScope.pageTitle = domain; //changing page title while switching between domains 

      $scope.subDomains = subDomainService.getSubDomain(id + 1); 
      $scope.subDomains.success(
        function(data, status, headers, config) { 

         $rootScope.subDomainNames = data.subdomains; 

        }).error(function(data, status, headers, config) { 

      }); 

      switch (id) { 
      case 0: 

       $location.path("/domain_one/dashboard"); 
       break; 

      case 1: 

       $location.path("/domain_two/dashboard"); 
       break; 

      case 2: 

       $location.path("/domain_three/dashboard"); 
       break; 

      case 'myKpi': 

       $location.path("/myKpi/dashboard"); 
       break; 
      } 

      $mdSidenav('left').toggle(); 
     }; 

     /*getting domains*/ 

     $rootScope.domainNames = []; 
     $scope.domains = domainService.getDomain(); 
     $scope.domains.success(function(data, status, headers, config) { 

      $rootScope.pageTitle = data.domains[0].Domain.name; //setting page title 

      for (var i = 0; i < data.domains.length; i++) { 

       $rootScope.domainNames.push(data.domains[i].Domain.name); 
      } 

     }).error(function(data, status, headers, config) { 

     }); 

    } ]); 

Seiten Dies sind HTML, wo ich diese Variablen verwenden und Funktionen-

  <div layout="row" class="nav nav-stacked sliderMenu"> 
      <md-sidenav md-component-id="left" md-is-open="isSidenavOpen"> 
       <div layout="column" > 
        <md-button class="panel-button firstBlock" ng-click="openSlider()"><i class="fa fa-bars" aria-hidden="true"></i></md-button> 
        <md-button ng-repeat="domain in domainNames" ng-click="redirect($index,domain)" >{{domain}}</md-button> 
        <md-button ng-click="redirect('myKpi')">My Kpis</md-button> 
        <md-button class="upload">Upload</md-button> 
       </div> 
      </md-sidenav> 
     </div> 

<!-- Menu Slider Starts --> 

<div 

    <label>Subcategory : </label> 
    <md-select placeholder="All Category" ng-model="SubDomains"> 
     <md-option ng-repeat="(key,value) in subDomainNames" value="{{value}}">{{value}}</md-option> 
    </md-select> 
</div> 
+2

Warum nicht eine Fabrik? – ajmajmajma

+0

Das passiert nur, wenn Sie die Seite neu laden ... oder? Wenn ja, stellen Sie sicher, dass die Variablen in Cookies gespeichert sind (sowohl vor als auch nach dem erneuten Laden). Wie auch immer, ich fühle mich nicht in rootScope zu halten ist eine gute Idee. –

+0

Ich möchte diese Variablen und Funktionen in meinen HTML-Seiten verwenden –

Antwort

0

Für Funktionen, die auf den Controllern benötigt werden

Sie folgendes verwenden:

  • Service
  • Fabrik

Für die Speicherung Variablen, die über Controller erforderlich ist

  • Sie in localstorage oder session je nach den Anforderungen speichern. Zum Beispiel, wenn Sie benötigen Daten, die nicht beim Schließen des Browser-Tab usw. verloren gehen, sollten Sie local

    zB verwendet werden sollen: das Speichern der Wunschliste in E-Commerce-Website ohne Anmeldung verwenden Sie local, so dass, wenn der Benutzer später zurückkehrt, Merk Daten kann gesehen werden

  • Sie können auch Dienste verwenden, um allgemeine Variablen zu speichern und innerhalb von Controllern dynamisch zur Laufzeit darauf zuzugreifen. Hinweis: hier die variablen Daten könnten auf Refresh verloren gehen, wenn Sie es im Backend zu speichern und API Anruf auf jedem aktualisieren

+0

Danke für Ihre Antwort .. Ich fand es hilfreich –

+0

aber wenn ich Funktionen in Diensten hinzufügen, wie kann ich diese Funktionen von meinen HTML-Seiten aufrufen? –

+0

Sie müssen diese Funktionen von Ihrem Controller aus aufrufen, indem Sie Services in den Controller injizieren. Sie können diesen bestimmten Anruf in eine Funktion umhüllen, die von der html –

0

Speicher von Variablen in $rootScope ist keine gut Idee, da die Daten beim Auffrischen nicht verfügbar sind, so können Sie die local storage oder session storage des Browsers zum Speichern von Variablen verwenden und Sie können auch Bibliotheken wieverwenden(https://github.com/gsklee/ngStorage) für besseres Handling. Was die Funktionen betrifft, wäre der Winkelservice gut.

Mehr Infos Winkelanbieter zur Verwendung finden Sie hier: https://gist.github.com/demisx/9605099

0

ich oft außerhalb des strengen „MVC“ -Modell Schritt und ein Singleton-Objekt definieren , genannt globals(Ich bin so einfallsreich ...), die in einer JS-Datei definiert ist, die von jedem, der es braucht, enthalten ist. Dieses Objekt verfügt über load() und save() Methoden, die mit dem lokalen Speicher interagieren. (Das Objekt wird sich nur einmal selbst "laden", auch wenn es so oft gefragt wird.) Jeder Kunde ist verpflichtet, irgendwann anrufen save(). (Der Versuch, dies in einem Destruktor zu tun, erzeugte Zeitprobleme.)

Alle "Globals", die in der gesamten Anwendung existieren, sind als Eigenschaften dieses Singleton-Objekts definiert. (Auch wenn sie nicht tatsächlich "gespeichert" werden.) Dies macht es explizit und offensichtlich, was "die globalen Werte dieser Anwendung" sind. Es macht deutlich, wo genau Referenzen im Quellcode zu finden sind.

Es auch zentralisiert die Pflicht der Erhaltung der Globals (wie notwendig) zu lokalen Speicher. Kein anderer Teil der Anwendung verweist jemals direkt auf lokalen Speicher. Dieses Objekt erkennt auch die Situation, in der der Benutzer lokalen Speicher, z. B., ausgeschaltet hat. durch "Private Browsing" -Modi und generiert eine entsprechende Warnung.)

Diese Selbstdisziplin hat sich bei der Erstellung von Anwendungen, die einfach zu debuggen sind, vielfach bewährt.

Wir haben bei der Erstellung einfach unsere eigene Logik ausgerollt.

+0

kannst du mir ein Demo-Beispiel dafür zeigen? –