Angularjs中的可点击单元格

Clickable cell in Angularjs

本文关键字：单元格 Angularjs      更新时间：2023-09-26

我可以在纯js中创建可点击的单元格，但当尝试使用angularjs做一些简单的事情时，它不起作用:当点击单元格时，它抱怨dum函数不退出。知道为什么吗?

<!DOCTYPE html>
<html>
<script src= "http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
<body>
<div ng-app="myApp" ng-controller="customersCtrl"> 
<table>
  <tr ng-repeat="x in names">
    <td onclick="dum();">{{ x.Name }}</td>
    <td>{{ x.Country }}</td>
  </tr>
</table>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('customersCtrl', function($scope, $http) {
    $http.get("http://www.w3schools.com/angular/customers.php")
    .success(function (response) {$scope.names = response.records;});
    $scope.dum = function() { alert("hi you"); }
});
</script>
</body>
</html>

Javascript onclick事件绑定将工作，但是在全局作用域中没有名为dum的函数。

如果你要在你的html中这样做，它会工作，例如:

<script>
 function dum(){
   alert('test')
 }
</script>

在有角的世界中，您需要使用ng-click代替，以便根据scope对绑定函数表达式进行评估。ng-click只是一个内置指令，它在内部绑定click事件，并在计算绑定到它的函数表达式后执行摘要循环。示例

相关文章：