【问题标题】:Can you invoke a fake state change in AngularJS?你能在 AngularJS 中调用一个虚假的状态变化吗?
【发布时间】:2018-06-05 17:31:26
【问题描述】:

在控制器函数中说,像这样:

$scope.fakeChangeState = function() {
    $state.go('stay right here and do nothing');
}

然后在按下按钮时调用它:

<button ng-click="fakeChangeState()">click</button>

这样的事情可能吗?

当点击网站上的某些按钮时,我想激活一个指令。该指令使用“$stateChangeStart”激活。

当使用导航栏导航到另一个页面时,该指令可以正常激活。但是,有些按钮不是导航的一部分,它们只会改变视图(即它们在点击时编辑页面上的内容而不改变状态)。

我们如何在不改变状态的情况下激活状态改变指令?

【问题讨论】:

  • 我假设您使用的是 Angular UI 路由器?什么版本?
  • 使用 0.2.13 @Amy
  • 我应该让它们链接到一条路线吗?这是最好的选择吗?
  • 只是为了弄清楚。你有一个指令监视 $stateChangeStart。现在您想单击一下以避免状态更改?点击后会发生什么?也许还有其他解决方案?
  • @Michael 所以想象页面有一个导航栏,所有这些链接都会改变状态,这没有问题。然后在页面内部,有一些按钮只是更改视图,即在页面上添加/更改信息。我们如何做到让按下这些按钮(不改变状态),在不导航到不同页面的情况下改变状态?

标签: javascript angularjs angularjs-directive


【解决方案1】:

您可以使用$stateChangeStart 事件来阻止导航到另一个状态(即默认状态)。我不确定您的指令何时触发,因此您的保存指令触发可能为时过早。

$rootScope.$on('$stateChangeStart',
function(event, toState, toParams, fromState, fromParams){
    event.preventDefault();
    // transitionTo() promise will be rejected with
    // a 'transition prevented' error
})

【讨论】:

  • 谢谢,但是保存指令已经使用 '$stateChangeStart' 触发,并且没有为链接设置路由以将它们发送到其他任何地方,也没有提示状态更改。
  • @Megawatt 如果我的答案不是您想要的,那么您的问题措辞不当,应该更新。这是使用 $stateProvider$state.go() 防止状态更改实际发生的正确方法,这就是您所要求的。
  • 嗯,问题不是“如何防止状态变化?”这更像是我如何“调用状态更改,但保持相同的状态”,即假状态更改
  • 这是调用状态更改,但保持相同的状态。您只是在它转换之前拦截它并停止转换,这是除了执行$state.reload 之外的唯一方法。看看我上面评论中的 SO 问题。从我所听到的一切来看,这听起来像是您正在努力实现的目标。如果我们能看到指令代码会更容易提供帮助
  • 也许我只是在解释问题方面很糟糕。网站上有按钮,按下按钮时根本没有激活状态更改。我试图让他们进行状态更改,但除了更新某些变量之外,他们不会链接任何地方或做任何事情。 "$stateChangeStart" 在这里无济于事,因为按钮不会调用任何状态更改,因此 "$stateChangeStart" 甚至不会激活。如何使按钮进行状态更改,但什么也不做?即虚假的状态变化
【解决方案2】:

只需从指令中复制代码并将其放入按下按钮时激活的控制器代码即可解决此问题。显然我不擅长解释问题是什么,但只是复制代码解决了问题。这使得该指令根本不必运行。

【讨论】:

    猜你喜欢
    • 2022-12-31
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2011-05-05
    • 2014-06-03
    • 2022-10-23
    • 2018-01-15
    相关资源
    最近更新 更多