2016-09-29 2 views
0

Ich habe einige Code hinzugefügt Interaktion mit dem Benutzer während Winkel $ HTTP-Anfragen sind in-progress zu blockieren:Zugang AngularJS Dienste von einem Controller

controller.js:

var app = angular.module("my_app", ["my_app"]); 
app.controller("MyController", ['$scope', '$http', function($scope, $http) { 
    $scope.blocking = false; 
    $scope.do_something = function() { 
    $scope.blocking = true; 
    $http({ 
     method: "POST", 
     url: "some.url.com", 
     data: my_data 
    }).success(function(data) { 
     // do something nice 
    }).error(function(data) { 
     // do some error handling 
    }).finally(function() { 
     $scope.blocking = false; 
    }); 
    }; 
}]); 

template.html:

<div ng-controller="MyController"> 
    <fieldset ng-disabled="blocking"> 
    <form> 
     ...a bunch of form elements... 
     ...including a "submit" button... 
     ...some of which call "do_something" above... 
    </form> 
    </fieldset> 
</div> 

Wenn ich ausführen, um die "do_something" fn dies richtig "blocking" auf true setzt Dies hat den Effekt, dass alle Benutzerinteraktionen innerhalb des Feldsets verhindert werden. Hurra.

Allerdings, mein Code muss so etwas viel tun. Also habe ich versucht, die Funktionalität zu einem Dienst zu bewegen:

service.js:

app.factory('$my_service', ['$http', function($http) { 
    _blocking = false; 
    return { 
    getBlocking: function() { 
     return _blocking; 
    }, 
    setBlocking: function(blocking) { 
     _blocking = blocking; 
    } 
    } 
}]); 

Dann ist mein "do_something" fn oben ruft einfach $ my_service.setBlocking nach Bedarf. Ich weiß jedoch nicht, was ich für das Argument von ng-behinderte sagen soll.

Irgendwelche Vorschläge?


Wie @ user449689 angefordert, hier ist der neue Controller-Code:

app.controller("MyController", ['$scope', '$http', '$my_service', function($scope, $http, $my_service) { 
    $scope.do_something = function() { 
    $my_service.setBlocking(true); 
    $http({ 
     method: "POST", 
     url: "some.url.com", 
     data: my_data 
    }).success(function(data) { 
     // do something nice 
    }).error(function(data) { 
     // do some error handling 
    }).finally(function() { 
     $my_service.setBlocking(false); 
    }); 
    }; 
}]); 

Aber ich kann nicht herausfinden, was in dem "ng-disabled" Attribute des Fieldset Elements zu setzen.

+0

zeigen uns den neuen Code, in dem Sie den Dienst – user449689

Antwort

1

einfach Ihre $scope.blocking auf dem Controller aktualisieren, um die Service-Methode $my_service.getBlocking und aktualisieren Sie die HTML

<fieldset ng-disabled="blocking()"> 

Auf Controller

$scope.blocking = $my_service.getBlocking 
+0

D rufen zu verweisen 'Oh! Es ist so einfach. Vielen Dank für Ihre Hilfe. – trubliphone

Verwandte Themen