AngularJS/ui-router: $state.go не работает внутри ng-click

У меня есть представление, где у меня есть следующий код:

<input type="button" value="New Post" ng-click="$state.go('blog.new-post')">

Целью является переход в новое состояние без использования href. К сожалению, приведенный выше код не срабатывает.

Я также попытался включить $state в контроллер для этого представления:

app.controller('blogPostsController', function($scope, $stateParams, $http, $state) ...

Но все равно ничего. transictionTo тоже не работает.

Кто-нибудь знает, как это сделать?

EDIT: я мог бы заставить его работать, назначив:

$scope.$state = $state;

внутри моего контроллера. Это кажется уродливым. Нет другого способа доступа к $state без назначения его в область видимости?

Ответ 1

В соответствии с https://github.com/angular-ui/ui-router/wiki/Quick-Reference#note-about-using-state-within-a-template вы можете добавить его в $rootScope, поэтому он будет доступен во всех областях и, следовательно, все шаблоны, by

angular.module("myApp").run(function ($rootScope, $state, $stateParams) {
  $rootScope.$state = $state;
  $rootScope.$stateParams = $stateParams;
});

Ответ 2

Если вы используете ui-router, существует атрибут ui-sref, который можно использовать следующим образом:

<a ui-sref="blog.new-post"></a>

Я рекомендую использовать это и ставить ссылку в виде кнопки (можно легко сделать, если вы используете библиотеку CSS, такую как Twitter Bootstrap). Тогда вам не нужно возиться с любым JavaScript при написании ваших ссылок.

Если вам нужно передать параметр в состояние, вы можете сделать следующее:

<a ui-sref="blog.edit-post({id: item.id})"></a>

где $scope.item - это объект с свойством ID, который вы хотите передать в качестве параметра URL.

Ответ 3

Простейшее решение - использовать $Window Service и старый подход

Ввести $window службу angular JS.
Используйте функцию history.back() javascript.
Готово, это простое решение, если вы просто хотите вернуться.

Я не буду писать целые angular JS. Только код, который имеет значение:

HTML-код

<button ng-click="$ctrl.goBack()">Go Back</button>

JS-код

self.goBack = function(){ $window.history.back(); };