Question

我正在尝试使用ng-click来调用我的控制器中的一个函数，但是我无法让它工作。我把所有东西都剥离到最简单的形式，所以我现在有了这个：

<button id="submitBtn" type="submit" class="btn btn-default"
  ng-click="count = count + 1; count = count + 2; alert('hello');" >Submit</button>

前两个语句（count = count + 1; count = count + 2;）执行得很好，但它不会调用alert函数。当我取出两个计数递增语句时，警报仍然不起作用。无论何时我尝试调用一个函数，它都会失败，但是普通的旧Javascript可以工作。

（仅仅是一个FYI，我在页面上有Javascript，阻止表单提交和触发回发）。

编辑：

我将包含我的控制器代码：

myApp.controller('LawSearchController', ['$scope', function ($scope) {

    $scope.alert = function (text) {
        alert(text);
    };
}]);

Answer 1

您在ng-expression中调用的所有函数都在$ scope的上下文中。

所以当你说alert()时，它会编译为未定义的scope.alert()，并且会无声地失败。

在您的控制器中，包含代码

$scope.alert = alert

Answer 2

正如其中一个答案所指出的那样，你需要在你的控制器中有一个功能：

$scope.alert = function(arg) {
  // Do something
};

Answer 3

以下是我的问题：

我曾尝试在页面上放置带有<form>标记的ng-controller指令。这是一个带有MasterPage的asp.net应用程序，并且（为什么，我不知道）在创建包含所有内容的新表单的页面时，表单会被替换。结果是我的ng-controller指令消失了。

我还尝试将ng-controller指令放在<asp:Content>标记内，但也会被删除。

解决方案：

将我的网页<form>包裹在<div>中并将ng-controller指令放在那里。

Answer 4

我不相信ngClick的预期用途包含大量的javascript。你应该只在NG点击中调用1个函数，该函数应该调用其他函数

我相信它应该更像下面这样实现我认为你需要从根范围获得警报功能。或

HTML Snippit

<button id="submitBtn" type="submit" class="btn btn-default" ng-click="submitAndAlert()" >Submit</button>

控制器

myApp.controller('controllerName', ['$scope', '$rootScope', function ($scope, $rootScope) {
    $scope.count = 0;

    $scope.submitAndAlert = function(){
        count += 1;
        count += 2;
        alert('hello');
    }

    $scope.alert = function (text) {
        // $rootScope.window.alert(text);
        $rootScope.alert(text);
    };
}]);

AngularJS ng-click指令不调用函数

4 个答案: