如何使用ng-click重定向

小编典典

如何使用ng-click重定向

angularjs

我正在尝试构建的超级简单AngularJS应用程序，用于将凭据接受到两个文本框中，然后使用双向绑定将按钮单击重定向到包含两个变量的URL。

我的问题是，我可以让它简单地工作

<a href=...>

（或ng-href = …），但是由于某种原因，无论我做什么，我都无法使用

<button>

我尝试了很多变体，但这是我想要做的

<button ng-click="$location.path('http://example.com/login.jsp?un={{username}}&pw={{password}}')" class="btn btn-lg btn-warning">Log In!</button>

如果我在控制器中调用一个函数，我可以使它正常工作，但这是一件很简单的事情，我希望在页面上尽可能完成它。

另外，作为附带的问题，登录到这样的站点的安全性问题是什么？

**编辑：让我感到困惑的部分是，这有效（只是没有双向绑定的作用）：

<button onClick="window.open('http://www.example.com/{{username}}');">

我希望将onClick更改为ng-click会产生相同的行为，但具有双向绑定。

**重新编辑/解决方案好了，所以我终于有了可行的解决方案。

我不知道为什么如上所述，Button标记无法起作用，但是这里是工作代码。

<a href="https://www.example.com/login.jsp?un={{username}}&pw={{password}}" class="btn btn-lg btn-warning">Log In!</a>

通过为它提供与我打算用于按钮的类相同的类，文本将看起来像按钮一样。

阅读 323

2020-07-04

共1个答案

小编典典

在您的控制器上放置一个方法来执行重定向，然后ng-click在按钮上调用。

标记：

<button ng-click="goLogin()">Log in</button>

控制器：

.controller('LoginCtrl', function($scope, $location) {
    $scope.form = {
        username: null,
        password: null
    };

    $scope.goLogin = function() {
        $location.url('http://test.com/login.jsp?un='+ $scope.form.username +'&pw="+ $scope.form.password);
    };
})

还要注意要拨打$location.url()不path()

要么…

添加$location到您的范围并调用url({{newUrl}})：

$controller('MyCtrl', function($scope, $location) {
    $scope.$location = $location;
})

我仍然会在范围上使用调用方法。

2020-07-04