AngularJS / ui-router: $ state.go ne fonctionne pas à l'intérieur de ng-click

J'ai une vision où j'ai le code suivant:

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

L'objectif est de faire la transition vers un nouvel état sans avoir à utiliser de href. Malheureusement, le code ci-dessus ne vient pas de l'incendie.

J'ai aussi essayé d'inclure $de l'état dans le contrôleur de ce point de vue:

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

Mais toujours rien. transictionTo aussi ne semble pas fonctionner.

Quelqu'un a une idée sur comment faire ce travail?

EDIT: je ne pouvais faire le travail par l'attribution de:

$scope.$state = $state;

à l'intérieur de mon contrôleur. Cela semble laid. Il n'y a vraiment aucun autre moyen d'accéder $état sans l'affecter à portée?

source d'informationauteur SrgHartman | 2013-12-17

  1. 11

    Selon https://github.com/angular-ui/ui-router/wiki/Quick-Reference#note-about-using-state-within-a-template vous pouvez l'ajouter à $rootScopede sorte qu'il sera disponible dans toutes les étendues et donc tous les modèles, par

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

    Si vous utilisez ui-router il y a un attribut appelé ui-sref qui peuvent être utilisés comme suit:

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

    Je recommande d'utiliser que le style et le lien qu'un bouton (peut se faire facilement si vous utilisez un CSS bibliothèque comme Twitter Bootstrap). Alors vous n'avez pas besoin de retoucher le code JavaScript lors de l'écriture de vos liens.

    Si vous avez besoin pour passer un paramètre dans l'état, vous pouvez effectuer les opérations suivantes:

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

    où $champ d'application.élément est un objet avec un ID de propriété, vous voulez être passé en paramètre de l'URL.

  3. 0

    Solution la plus simple est d'utiliser $de la Fenêtre de Service de l'ancienne Approche

    1. Injecter $fenêtre service de angular JS.
    2. Utilisation l'histoire.back() fonction de javascript.
    3. Fait,C'est la solution la plus simple si vous voulez juste pour aller en arrière.

    Je ne vais pas écrire tout angular JS. Que du code de questions:

    Code HTML

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

    JS-Code

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