Angular Controller Load()

Question

Dies ist ein Quiz für viele, aber ich habe nie zuvor mit Winkel gearbeitet und ich brauche Hilfe, um eine einfache Aufgabe zu erreichen, weil ich stecken bleiben.

Mein ng-Controller processctrl hat eine load() Methode deklariert. Meine Ansicht hat zwei Aufrufe an ng-controller="processoctrl", was dazu führt, dass die Methode load() zweimal ausgeführt wird. processctrl hat auch eine Eigenschaft currentPhase, die null startet und load() seinen Wert festlegen. Ich könnte einfach ($scope.currentPhase || load()) schreiben, um doppelte load() zu verhindern, aber die Bindung an currentPhase tritt über (in DOM) des Repeaters auf.

Ich könnte eine Objekteigenschaft in das $ rootScope legen und es von processoctrl.scope.load() aktualisieren, aber es würde in einen Wahnsinn verwandeln.

Ich könnte einfach $ ($ (". HeaderCurrentPhase") [0]) .html ($ scope.currentPhase) in meine load() -Methode, aber es ist auch Wahnsinn.

Ich konnte umschreiben load() zu getProcesses = function(){} und $rootScope.$emit('getProcesses',{}) an anderer Stelle und in den Controller $rootScope.$on('getProcesses',getProcesses) diese doppelte load() zu verhindern, aber ich denke, das redundate ist, so wie eine Controller-Funktion statt Last zu rufen Sie einfach an()? Oder wie erreicht man diese einfache Aufgabe? Benutze eine Direktive?

Ansicht:

<div ng-include src="'includes/overview-header.html'"></div> 
<div ng-include src="'includes/process-info.html'"></div> 

Ausschnitt aus umfasst/Übersicht-header.html:

<div class="col-md-12"> 
.... 
    <h4><strong>currentPhase</strong></h4> 
    <p ng-controller="processoctrl"> 
     <span class="label label-primary headerCurrentPhase" ng-bind="currentPhase"></span> 
    </p> 
</div> 

Ausschnitt aus umfasst/Prozess-info.html:

<tbody ng-controller="processctrl"> 
    <tr ng-repeat="Process in Processes|orderBy:'ID'"> 
     <td>{{Process.isCurrent}}</td> 
     <td>{{Process.isCurrent}}</td> 
     <td>{{Process.ID}}</td> 
     <td>{{Process.Title}}</a></td> 
    </tr> 
</tbody> 

processoctrl

(function (app) { 
    app.controller('processctrl', function ($scope, $rootScope, $routeParams, factorysvc) { 
     $scope.Processes = []; 
     $scope.currentPhase = null; 
     load(); 

     //($scope.currentPhase || load()) 

     function load() { 
      var promiseGet = factorysvc.getPsby($routeParams.itemId); 

      promiseGet.then(function (data) { 

       $scope.Processes = data; 

       $rootScope.root.empreendimento.currentPhase = $scope.currentPhase = data[0].currentPhase.Title; 

      }, function (err) { 
       $scope.Message = "Error " + err.status; 
      }); 

    } 

})}(angular.module('sgaapp'))); 

Answer 1

Mann, ich nicht fangen, was Sie tun wollen, aber ich möchte Ihnen einige Ratschläge nehmen:

1. Ihre Logik ist es wirklich kompliziert, man sollte es wieder denken, denn jetzt ist es saugt;

2. Beinhaltet in eckigen saugt auch. Ja wirklich. Du solltest es überhaupt nicht benutzen. Wie man es vermeidet? Nun, es gibt zwei Möglichkeiten.

   • Zuerst ist clientseitige Routing (für Seiten) zu verwenden; Anstatt das integrierte Routing zu verwenden, verwenden Sie besser ui-router.Sie können verschachtelte Status und Routen verwenden.
   • Zweitens ist die Verwendung von Direktiven statt Includes. Stellen Sie sich vor, Kopfzeile oder Fußzeile, beide können Direktiven sein, die Sie einfach in Seiten einfügen, wenn sie benötigt werden.

Was für mich - ich verwende erste und die zweite Lösung in der gleichen Zeit.

3. Sie sollten vermeiden, irgendetwas in $rootScope zu setzen. Vielleicht kann es dich nicht töten, und von Zeit zu Zeit ist es die einzige Lösung, aber weißt du, es ist eine schlechte Übung.

4. Wenn Sie Daten speichern und zwischen Controllern freigeben müssen, ist die bessere Option für uns Fabriken (oder andere Dienste, aber Fabriken am universellsten).

Beispiel:

app.factory('MyFactory', function() { 
    return { 
     myData: 'some default value', 
     someCommonFuction: function (a, b) { 
      return a + b; 
     } 
    }; 
}); 

sowie Daten-Speicher, können Sie Fabrik als Utility-Klasse verwenden, mit gemeinsamen Funktionen

Answer 2

Gibt es einen echten Bedarf 2 enthält haben?

Wenn overview-header über mehrere Ansichten hinweg gemeinsam genutzt wird, können wir currentPhase auf $ rootScope-Ebene oder mit einem übergeordneten Controller haben und haben.

Wenn overview-header nur für diese Ansicht ist, dann können wir beide htmls zu einem zusammenfassen und processctrl in Wrapped-Tags haben.