Nie można uzyskać dostępu do lokalizacji $ przy użyciu metody .controller w AngularJS

Question

Używam funkcji ng-submit w formularzu do przesyłania danych do bazy Firebase, wszystko działa zgodnie z oczekiwaniami. Chciałbym zmienić widoki w tym samym czasie. Na samym przycisku przesyłania mam zestaw ng-click, aby wykonać funkcję za pomocą $ location. Jeśli umieściłem moją funkcję changeView w metodzie .controller, nie mogę wykorzystać $ location (konkretnie, mówi - "Error:" undefined "nie jest obiektem (oceniającym" $ location.path ")"). Każda pomoc będzie super duperem.

// This doesn't work and throws the error 
myApp.controller('CtrlName', ['$scope', 'angularFireCollection', 
    function($scope, angularFireCollection, $location) { 

     $scope.changeView = function(view) { 
      $location.path(view); 
     } 

    } 
]); 



// This works as expected, but I'm name spacing my functions globally and I will have to change how I'm accessing my Firebase, which isn't really desired. 
function CtrlName($scope, angularFireCollection, $location) { 

    $scope.changeView = function(view) { 
     $location.path(view); 
    } 

} 

Oto mój szablon:

<form role="form" ng-submit="tactics.add(tactic)"> 
    <div class="form-group"> 
     <label>Select Method</label> 
      <select class="form-control" ng-model="tactic.type"> 
       <option>Email</option> 
       <option>Display</option> 
      <option>SMS</option> 
      <option>Print</option> 
     </select> 
    </div> 
    <button type="submit" class="btn btn-success" ng-click="changeView('/my-tactics')">Save</button> 
</form> 

Answer 1

Nie jesteś wstrzykiwanie przedmiot do kontrolera $location. Jest on wymieniony w parametrach funkcji, ale zapomniałeś dodać go do listy przed wspomnianą funkcją.

myApp.controller('CtrlName', ['$scope', 'angularFireCollection','$location', 
    function($scope, angularFireCollection, $location) { 
     ... 
    }]); 

Answer 2

Święta krowa Nie mogę uwierzyć, że kiedykolwiek to robiłem. #Facepalm. Oto właściwy sposób przekierowania na przesyłanie formularzy.

Szablon

<form role="form" ng-submit="vm.submit(tactic)"> 
    <div class="form-group"> 
     <label>Select Method</label> 
      <select class="form-control" ng-model="tactic.type"> 
       <option>Email</option> 
       <option>Display</option> 
      <option>SMS</option> 
      <option>Print</option> 
     </select> 
    </div> 
    <button type="submit" class="btn btn-success">Save</button> 
</form> 

Controller

angular.module('MyApp') 
    .controller('CtrlName', function($scope, $location, $log, angularFireCollection, tactics) { 

    var vm = this; 

    vm.submit = function submit(item) { 

    tactics.add(item) 
     .then(function(rsp) { 
     $log.debug('Attempted to add tactic to Firebase', rsp); 
     $location.path('/my-tactics'); 
     }); 

    }; 

    } 
); 

Wybitne Zmiany:

1. nie używam adnotacje dla mojego DI, I offl postaraj się to ng-adnotate, co łagodzi wszelkie problemy, na które napotkałem, gdy pierwotnie zadawałem to pytanie.
2. Używam składni "kontroler jako", która nie istniała w czasie tego pytania.
3. Nie tworzę już jakiegoś dziwnego warunku wyścigu, próbując wykonać dwie osobne akcje w dwóch osobnych funkcjach na jednym możliwym wydarzeniu. Obietnice są idealnym rozwiązaniem dla tego rodzaju akcji.

Answer 3

Również nie zapomnij dodać $ lokalizację do swojego działania:

authControllers.controller('AuthRegisterCtrl', ['$scope', '$http', '$location', 

function ($scope, $http, $location) { 

    $scope.master = {}; 

    $scope.save = function (user) { 
     $scope.master = angular.copy(user); 
     $http({ 
      method: 'POST', 
      url: '/angular/auth/register', 
      data: user 
     }).success(function (d) { 
      $location.path('/login'); 

     }); 
    }; 
}]);