我正在使用 AngularJS、Monaca 和 Onsen UI 构建一个跨平台应用程序。
我正在尝试从 View 上的 ng-click() 调用 Controller 中的函数。但是，当我单击调用该函数的按钮时，我收到一条错误消息:“Uncaught ReferenceError:checkUserLoginDetails 未定义”
我的index.html如下所示
<!DOCTYPE HTML>
<html ng-app="myApp">
<head>
<!-- Usual scripts goes here -->
<script src="js/app.js"></script>
<script src="js/login.js"></script>
<script src="js/sharedProperties.js"></script>
</head>
<body>
<ons-navigator var="myNavigator" page="login.html"></ons-navigator>
</body>
</html>
我看不出我哪里出了问题。
我的 这是我调用函数的 login.html 。
<div ng-controller="LoginController">
<ons-page>
<form class="login-form" style="text-align: center" name="myForm">
<section style="padding: 8px">
<input type="password"
class="text-input--underbar"
required
minlength="3"
maxlength="4"
ng-model-options="{ debounce : 500 }"
placeholder="User ID"
ng-model="userID" >
</section>
// Button not working here
<section style="padding: 0 8px 8px">
<ons-button var="saveBtn" ng-disabled="myForm.$invalid" modifier="large" ng-click="checkUserLoginDetails()">Log In</ons-button>
</section>
</form>
</ons-page>
</div>
这是我处理逻辑的 loginController.js 代码(逻辑省略)
var login = angular.module("loginController", []);
login.controller("LoginController", function($scope, $http, SharedProperties)
{
// Watch for changes in the User ID text field
$scope.$watch('userID', function(newVal, oldVal)
{
// Code omitted but WORKING
});
// Check user Logins
$scope.checkUserLoginDetails = function()
{
console.log("Getting here..."); // Not getting here
}
});
在我的主 app.js 中，我创建了包含所有 Controller 的模块 - 这再次适用于所有其他 View 和 Controller (再次从列表中省略，因为不需要)，所以我怀疑问题就在这里。
var app = angular.module("myApp", ['onsen', 'sharedProperties', 'loginController']);
我也尝试过onclick而不是ng-click，但机器人给出了相同的错误消息。
最佳答案
如果ons-page是带有transclution的指令，则该函数在transclution主体中不可用，因为带有transinclude的指令会创建自己的作用域。
关于javascript - 尝试在 AngularJS 上调用函数时出错，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/37296093/