我正在尝试使表格单元格可点击。单击单元格时，它会将内容从一个单元格切换到另一个单元格。我想通过最终使用 angular.element 获取被点击的元素并将第二个被点击的方 block 设置为等于第一个 clicked.html() 来从这个点击 Action 中制作一个基本的国际象棋游戏。这在 AngluarJs 中是否可能以某种方式使用 MEAN？
我当前的代码看起来像这样，但当我单击时，表格单元格没有更改或执行任何操作。
app.controller('ChessCtrl' , ['$http', '$scope', '$document', function
ChessCtrl($http, $scope, $document) {
var vm = this;
vm.test1 = angular.element(document.getElementById("A1"));
vm.test2 = "";
vm.test3 = "This is a test";
$scope.click = function() {
var temp = vm.test3;
vm.test2 = temp;
vm.test3 = "";
}
}]);
<div ng-Controller="ChessCtrl">
<div class="content">
<div class="left">
<table style="width: 75%">
<tr>
<td id="A1" ><a ng-bind="vm.test3" ng-click="click()"></a></td>
<td class="grey" ng-bind="vm.test2"><a ng-bind="vm.test2" ng-click="click()"></a>
</td>
<td>
</tr>
</table>
</div>
</div>
</div>
显然我遗漏了一些东西，但我已经尝试添加到数据库并将其拉回。我已经尝试过 ng-model 和 ng-bind 来保存变量。我只是迷失了是否或如何让 td 可点击并切换点击显示的位置。谢谢!
注意:忽略此示例中的 test1...我之前使用它来测试从元素中获取 HTML。
最佳答案
HTML 不需要 <a>标签。只需将 CSS 样式设置为 cursor: pointer .
还有 ng-bind不需要指令，只需使用双大括号将模型绑定(bind)到 HTML {{ }}表达式。
演示
angular.module("app",[])
.controller('ChessCtrl' , function () {
var vm = this;
vm.test2 = "♔";
vm.test3 = "test";
vm.switch = function() {
var temp = vm.test2;
vm.test2 = vm.test3;
vm.test3 = temp;
}
});.red { background-color: red; }
.grey { background-color: grey; }
td {
width: 20%;
cursor: pointer;
font-size: 24pt;
}<script src="//unpkg.com/angular/angular.js"></script>
<body ng-app="app" ng-controller="ChessCtrl as vm">
<table>
<tr>
<td class="red" ng-click="vm.switch()">{{vm.test3}}</td>
<td class="grey" ng-click="vm.switch()">{{vm.test2}}</td>
</tr>
</table>
</body>关于javascript - 我正在尝试使用 angularjs 切换表格单元格中的值...我可以使用 ngbind 或 ngmodel 或其他东西吗？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/55939449/