AngularJS/ui-router: $ state.go non funziona all'interno ng clic

Question

ho una visione in cui ho il seguente codice:

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

L'obiettivo è quello di transizione verso un nuovo stato, senza dover usa href. Sfortunatamente il codice sopra non fa fuoco.

Ho anche cercato di includere $ Stato nel controller per questa vista:

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

Ma ancora niente. la transizione anche non sembra funzionare.

Qualcuno ha qualche idea su come fare questo lavoro?

EDIT: ho potuto solo farlo funzionare assegnando:

$scope.$state = $state; 

dentro il mio controller. Questo sembra brutto. Non c'è davvero nessun altro modo per accedere a $ stato senza assegnarlo all'ambito?

Answer 1

Secondo https://github.com/angular-ui/ui-router/wiki/Quick-Reference#note-about-using-state-within-a-template è possibile aggiungerlo a $rootScope, in modo che sarà disponibile in tutti gli ambiti e, quindi, tutti i modelli, dalla

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

Answer 2

Se si utilizza ui-router v'è un attributo chiamato ui-sref che possono essere utilizzato come segue:

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

vi consiglio di usare quello e lo styling il collegamento come un pulsante (può facilmente essere fatto se si sta utilizzando una libreria di CSS come Twitter Bootstrap). Quindi non è necessario fare confusione con JavaScript durante la scrittura dei collegamenti.

Se è necessario passare un parametro nello stato, è possibile effettuare le seguenti operazioni:

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

dove $ scope.item è un oggetto con una proprietà ID che si desidera essere passato come parametro URL.

Answer 3

più semplice soluzione è quella di utilizzare $ Finestra Servizio e vecchio approccio

1. Inject $ finestra servizio di JS angolare.
2. Utilizzare la funzione history.back() di javascript.
3. Fatto, è la soluzione più semplice se si vuole solo tornare indietro.

Non scriverò JS tutto angolare.Solo il codice che conta:

codice HTML

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

JS-Code

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