AngularJS/ui-router:$ state.go在ng-click中不起作用

Question

我有一个视图,我有以下代码:

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

目标是在不必使用href的情况下转换到新状态.不幸的是,上面的代码并没有触发.

我还尝试在控制器中为此视图包含$ state:

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

但仍然没有.transictionTo似乎也没有用.

任何人都知道如何使这项工作？

编辑:我只能通过分配:

$scope.$state = $state;

在我的控制器内.这看起来很难看.没有其他方法来访问$ state而不将其分配给范围？

Answer 1

如果您使用的ui-router是有一个名为的属性ui-sref,可以按如下方式使用:

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

我建议使用它并将链接设置为按钮样式(如果您使用的是像Twitter Bootstrap这样的CSS库,则可以轻松完成).然后,在编写链接时,您不需要乱用任何JavaScript.

如果需要将参数传递到状态,可以执行以下操作:

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

其中$ scope.item是一个具有ID属性的对象,您希望将其作为URL参数传递.

@roymath,其实你可以!答案已被编辑. (3认同)
这应该是接受的答案.当然,你将无法通过这种方式将params传递给州. (2认同)
谢谢 - 这真的很棒..我也意识到的一件事是你可以非常优雅地改变网址路径的一部分 - 即:基本上是通过在州内导航.示例:您有一个状态为"S"的URL,如下所示:`/ foo /:aa /:bb /:cc`如果您已经处于该状态,其路径类似于`/ foo/joe/blow/rocks`并且你想把`blow`改为`sixpack`,但剩下的就是其余的,只需要有一个'ui-sref ="S({bb:'sixpack'})"` - 而不用担心其他的参数.如果你试图直接修改`$ location.path`,这将更难 (2认同)

Answer 2

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