2016-08-03 19 views
2

Ich benutze SonarLint mit Eclipse-, und ich bin Codding eine Anwendung mit AngularJS. Ich hatte ein Problem mit einem Controller, so dass ich versuchte, es ein bisschen sauberer zu sehen, und dann SonarLint brachte mir ein Problem:Komplexität größer als die autorisierten in AngularJS Controller (SonarLint Ausgabe)

Funktion hat eine Komplexität von 11, die größer als 10 berechtigt ist.

Und hier ist der Code meines Controller:

app.controller('LauncherCtrl', function ($scope, $http) { 

    $scope.genStatus = "stopped"; 

    $scope.startgenerator = function() { 
     $http.get('/start').success(function() { 
      $scope.updateStatus(); 
     }); 
    }; 

    $scope.resumegenerator = function() { 
     $http.get('/resume').success(function() { 
      $scope.updateStatus(); 
     }); 
    }; 

    $scope.suspendgenerator = function() { 
     $http.get('/suspend').success(function() { 
      $scope.updateStatus(); 
     }); 
    }; 

    $scope.stopgenerator = function() { 
     $http.get('/stop').success(function() { 
      $scope.updateStatus(); 
     }); 
    }; 

    $scope.updateStatus = function() {    
     $http.get('/status').success(function (response) { 
       $scope.genStatus = response.data; 
     }); 
    }; 

    $scope.updateStatus(); 
}); 

Gibt es etwas falsch mit ihm? Ich nehme an, dieses Problem würde über zu viele verschachtelte Loops/Funktionen gehen, aber soweit ich sehen kann, ist es nicht (abgesehen von den Funktionen start/stop/resume/pause, die update aufrufen, aber es ist nicht Komplexität 11, ist es ?). + Ich habe die Klammern/Klammern doppelt überprüft, ich glaube nicht, dass das Problem von dort kommt.

Antwort

3

Wenn Sie Komplexität entfernen möchten, können Sie eine Funktion machen:

$scope.startgenerator = function() { 
     $http.get('/start').success(function() { 
      $scope.updateStatus(); 
     }); 
    }; 

    $scope.resumegenerator = function() { 
     $http.get('/resume').success(function() { 
      $scope.updateStatus(); 
     }); 
    }; 

    $scope.suspendgenerator = function() { 
     $http.get('/suspend').success(function() { 
      $scope.updateStatus(); 
     }); 
    }; 

    $scope.stopgenerator = function() { 
     $http.get('/stop').success(function() { 
      $scope.updateStatus(); 
     }); 
    }; 

zu

$scope.generatorAction = function(action) { 
    $http.get('/' + action).success(function() { 
     $scope.updateStatus(); 
    }); 
}; 

und es dann wie folgt verwenden:

$scope.generatorAction('stop'); 

Oder einen Dienst verwenden, Handle deine HTTP-Anfrage, es ist eine bessere Praxis.

Edit:

ich diesen Styleguide für meine Winkelanwendungen bin mit: https://github.com/johnpapa/angular-styleguide/blob/master/a1/README.md

einen einfachen Service für Ihre HTTP-Anfrage erstellen:

(function() { 
    'use strict'; 

    angular 
    .module('yourModuleName') 
    .factory('generator', generatorFactory); 

    function generatorFactory($http) { 

    var service = { 
     start: start, 
     resume: resume, 
     suspend: suspend, 
     stop: stop 
    } 

    return service; 

    function start() { 
     return $http.get('/start'); 
    } 

    function resume() { 
     return $http.get('/start'); 
    } 

    function suspend() { 
     return $http.get('/suspend'); 
    } 

    function stop() { 
     return $http.get('/stop'); 
    } 
    } 

})(); 

Und dann in Ihrem Controller:

app.controller('LauncherCtrl', function ($scope, generator, $http) { 

    $scope.genStatus = "stopped"; 

    $scope.startgenerator = function() { 
     generator.start().then(function() { 
      $scope.updateStatus(); 
     }); 
    }; 

    $scope.resumegenerator = function() { 
     generator.resume().then(function() { 
      $scope.updateStatus(); 
     }); 
    }; 

    $scope.suspendgenerator = function() { 
     generator.suspend().then(function() { 
      $scope.updateStatus(); 
     }); 
    }; 

    $scope.stopgenerator = function() { 
     generator.stop().then(function() { 
      $scope.updateStatus(); 
     }); 
    }; 

    $scope.updateStatus = function() {    
     $http.get('/status').success(function (response) { 
       $scope.genStatus = response.data; 
     }); 
    }; 

    $scope.updateStatus(); 
}); 

Zuerst scheint es mehr Code a zu nehmen Und mehr Komplexität für Ihre App, aber wenn Sie Ihren Generator auf einer anderen Seite oder in einer Komponente/Direktive stoppen müssen, müssen Sie nur Ihren Generator-Dienst injizieren und generator.stop(); tun und damit, wenn eines Tages Ihre Endpunkt-URL geändert, müssen Sie sie nur in Ihrem Service ändern.

+0

Dank, dachte ich nicht, nur eine Funktion zur Verwendung von . Da ich neu in Javascript/AngularJS bin, bin ich an einer guten Praxis interessiert. Kannst du mir ein paar Tipps geben, wie ich mit der http-Anfrage umgehen soll? Was soll der Dienst tun? – Krihox

+0

Gerade editiert meine Antwort – Gatsbill

+0

Großartig, vielen Dank! + Ich überprüfe den von Ihnen vorgeschlagenen Style Guide, der interessant erscheint – Krihox

2

Ist etwas nicht in Ordnung?

Sie suchen nach einer objektiven Antwort auf eine subjektive Frage. Nehmen wir an, je komplexer eine Funktion wird, desto mehr Mühe haben Sie (oder jemand anderes) damit, diese zu erhalten. Dieses Problem weist darauf hin, dass Sie einen beliebigen Punkt erreicht haben, an dem der Code möglicherweise schwer zu verstehen ist.

es ist keine Komplexität 11, oder?

Die Art und Weise Sonarqube Komplexität zählt nicht ganz keines der derzeit ausgesprochenen Normen entsprechen, aber hier ist, wie es die Nummer 11 bekam:

app.controller('LauncherCtrl', function ($scope, $http) { // +1 

    $scope.genStatus = "stopped"; 

    $scope.startgenerator = function() {     // +1 
     $http.get('/start').success(function() {   // +1 
      $scope.updateStatus(); 
     }); 
    }; 

    $scope.resumegenerator = function() {     // +1 
     $http.get('/resume').success(function() {  // +1 
      $scope.updateStatus(); 
     }); 
    }; 

    $scope.suspendgenerator = function() {    // +1 
     $http.get('/suspend').success(function() {  // +1 
      $scope.updateStatus(); 
     }); 
    }; 

    $scope.stopgenerator = function() {     // +1 
     $http.get('/stop').success(function() {   // +1 
      $scope.updateStatus(); 
     }); 
    }; 

    $scope.updateStatus = function() {     // +1 
     $http.get('/status').success(function (response) {// +1 
       $scope.genStatus = response.data; 
     }); 
    }; 

    $scope.updateStatus(); 
});