gpt4 book ai didi

javascript - ng-click 函数无需点击立即执行函数

转载 作者:行者123 更新时间:2023-11-30 17:25:30 25 4
gpt4 key购买 nike

我是 Angular 的新手,正在尝试设置登录系统。我有一些“按钮”设置,可以在单击按钮时将用户重定向到用户 facebook/google 帐户的 Oauth 提示。我的问题是登录用户的功能是在页面日志上立即执行的,而不是在单击按钮时执行的。

我很确定根源在于 JS 对象的工作方式,但我仍在学习 angularjs,它有点令人困惑。

我相信将函数放在 $scope 上会立即执行它们,但我不知道我还能如何将它们暴露给 ng-click。

谁能帮我弄清楚如何让按钮按预期工作?

模板:

<ion-view title="Account">
<ion-nav-buttons side="right">
<button menu-toggle="right" class="button button-icon icon ion-navicon"></button>
</ion-nav-buttons>
<ion-content class="has-header padding">

<h1 ng-click="google_login()">Log in with Google</h1>
<h1 ng-click="fb_login()">Log in with Facebook</h1>
<h1 ng-click="dev_login()">Dev login</h1>
<div id="logs"></div>
<form class="list">
<label class="item item-input">
<input type="text" placeholder="Username" ng-model="user.username" required>
</label>
<label class="item item-input">
<input type="password" placeholder="Password" ng-model="user.password" required>
</label>
<div class="padding">
<button class="button button-block button-stable" ng-click="email_authenticate()">Login</button>
</div>
</form>
</ion-content>
</ion-view>

Controller :

.controller('AccountCtrl', function($scope, $state, Authentication) {
$scope.dev_login = Authentication.dev_authenticate(); //executes immediately
$scope.fb_login = Authentication.fb_authenticate(); //executes immediately
$scope.google_login = Authentication.google_authenticate(); //executes immediately
$scope.email_login = Authentication.email_authenticate(); //executes immediately
$scope.logout = Authentication.logout();
});

这些在 services.js 中定义:

.factory('Authentication', function ($http) {
return {
authenticate: function () {
return $http({
url: 'https://api.squawkfinace.com/authenticate',
method: 'post'//,
//data: {facebook_authtoken: key}
});
},
fb_authenticate: function () {
return $.oauth2({
//Oauth details
}, function (token, response) {
localStorage.setItem("LoggedInAccount", JSON.stringify({'platform': 'facebook', 'token': token}));
console.log(token);
$state.transitionTo("app.notifications");
}, function (error, response) {
// do something with error object
});
},
google_authenticate: function () {
return $.oauth2({
//oauth details
}, function (token, response) {
localStorage.setItem("Account", JSON.stringify({'platform': 'google', 'key': token}));

}, function (error, response) {
// do something with error object
$("#logs").append("<p class='error'><b>error: </b>" + JSON.stringify(error) + "</p>");
$("#logs").append("<p class='error'><b>response: </b>" + JSON.stringify(response) + "</p>");
});
},
dev_authenticate: function () {
return null;
},
email_authenticate: function () {
return null;
},
logout: function () {
localStorage.removeItem("Account");
return null;
}
}
});

最佳答案

因为你实际上是在执行函数

$scope.dev_login = Authentication.dev_authenticate();

应该是

$scope.dev_login = Authentication.dev_authenticate;

第一个场景执行函数并将结果分配给$scope。您想要将引用分配给函数。

关于javascript - ng-click 函数无需点击立即执行函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24376217/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com