Ng-Click事件未触发

时间:2014-05-29 12:02:41

标签: angularjs

您好,我今天刚刚开始学习Angular,在尝试绑定一个事件时遇到了一些问题。这就是我到目前为止所做的事情。我在html页面上加载了所有脚本:

<script src="Scripts/jquery-1.9.0.js"></script>
<script src="Scripts/angular.js"></script>

<script src="app/modules.js"></script>

<script src="app/Controllers/studentGradesController.js"></script>

然后我创建了一个文件模块并定义了我的模块:

var angularTestApp = angular.module('AngularTestApp', []);

然后我创建了一个控制器:

angularTestApp.controller('StudentGradesController', function StudentGradesController($scope) {


    $scope.students = [
       {
            firstName: 'Lorem',
            lastName: 'Ipsum',
            age: 24,
            grade: 5,
            votes: 0
       },
       {
           firstName: 'Lorem',
           lastName: 'Ipsum',
           age: 250,
           grade: 21,
           votes: 0
       }


      ...
    ];

    $scope.downVote = function(student) {
        student--;
    };
    $scope.upVote = function (student) {
        alert("I work");
    };
}); 

然后我在我的html上绑定了控制器:

   <article class="container" ng-controller="StudentGradesController">
        <section>
            <section ng-repeat="student in students" class="row">
                <div class="col-md-1 text-center">
                    <i class="fa fa-chevron-up pointer" ng-click="upVote"></i> 
                    <span ng-bind="student.votes" class="center-block"></span>
                    <i class="fa fa-chevron-down pointer" ng-click="downVote"></i>
                </div>
                <div class="well col-md-11">
                    <div>
                        <span ng-bind="student.firstName"></span>
                        <span ng-bind="student.lastName"></span>
                    </div>
                </div>
            </section>
        </section>
    </article>

当我尝试点击绑定的项目时没有任何反应。没有错误被抛出。任何人都可以告诉我我做错了什么?

3 个答案:

答案 0 :(得分:3)

您在ng-click中提供的参数不是函数,而是AngularJS表达式。这就像一个Javascript表达式。您应该使用ng-click="upVote(student)"来呼叫它。

答案 1 :(得分:3)

使用ng-click调用函数而不是仅引用它。添加括号将使其成为函数调用:

<i class="fa fa-chevron-up pointer" ng-click="upVote(student)"></i> 

那说; i tag只是将文本放在斜体中,而且没有指定文本,因此没有任何内容可以点击。

答案 2 :(得分:2)

尝试ng-click="downVote(student)"ng-click="upVote(student)"