Не удается получить доступ к $location при использовании метода .controller в AngularJS
Я использую ng-submit в форме для ввода данных в Firebase, все работает так, как ожидалось. То, что я хотел бы сделать, - это изменение взглядов одновременно. На самой кнопке отправки я установил ng-click для выполнения функции с помощью $location. Если я помещаю функцию changeView в метод .controller, я не могу использовать $location (в частности, он говорит - "Ошибка:" undefined "не является объектом (оценка" $location.path ")" ). Любая помощь будет супер пупер.
// 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);
}
}
Вот мой шаблон:
<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>
Ответы
Ответ 1
Вы не вводите объект $location
в свой контроллер. Он указан в параметрах вашей функции, но вы забыли добавить его в список перед указанной функцией.
myApp.controller('CtrlName', ['$scope', 'angularFireCollection','$location',
function($scope, angularFireCollection, $location) {
...
}]);
Ответ 2
Также не забудьте добавить $location в ваше действие:
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');
});
};
}]);
Ответ 3
Святая корова, я не могу поверить, что я когда-либо делал это. #Facepalm. Вот правильный способ перенаправления при отправке формы.
Шаблон
<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>
Контроллер
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');
});
};
}
);
Заметные изменения:
- Я не использую аннотации для своего DI, я выгружаю это в ng-annotate, а затем смягчает любые проблемы, такие как тот, с которым я столкнулся, когда задавал этот вопрос.
- Я использую синтаксис "контроллер как", который не существовал во время этого вопроса.
- Я больше не создаю какое-то странное состояние гонки, пытаясь выполнить два отдельных действия в двух отдельных функциях, возможно, в одном событии. Promises являются идеальным решением для такого рода действий.