Question

我有一段代码可以将一个简单的字符串：JSBin。更改handsontable中的单元格值将更改其对应的字符串。

<html ng-app="app">
  <head>
    <script src="https://handsontable.github.io/ngHandsontable/node_modules/angular/angular.js"></script>
    <script src="https://docs.handsontable.com/pro/1.8.2/bower_components/handsontable-pro/dist/handsontable.full.js"></script>
    <link type="text/css" rel="stylesheet" href="https://docs.handsontable.com/pro/1.8.2/bower_components/handsontable-pro/dist/handsontable.full.min.css">
    <script src="https://handsontable.github.io/ngHandsontable/dist/ngHandsontable.js"></script>
  </head>
  <body>
    <div ng-controller="MainCtrl">
      <hot-table hot-id="mytable" datarows="db"></hot-table>
      <br><br>
      <span>{{ data }}</span>
    </div>
  </body>
</html>

JavaScript的：

function MainCtrl($scope, hotRegisterer) {
  $scope.db = [[5, 6], [7, 8]];

  $scope.$watch("db", function (newValue, oldValue) {
    console.log("$watch");
    var hot_instance = hotRegisterer.getInstance("mytable"); 
    $scope.data = hot_instance.getData();
  }, true)
}
MainCtrl.$inject = ['$scope', 'hotRegisterer'];

angular.module('app', ['ngHandsontable'])
  .controller('MainCtrl', MainCtrl)

但是，如果我们在表格中添加了一个新的数字值，它将被视为数组中的字符串，它与其他值格式不一致阵列。

我不知道为什么handsontbale默认将所有单元格值都视为字符串类型。有没有办法设置新的数字单元格值被视为数字类型？

编辑1：根据@acesmndr的回答，我完成了this。我想在db添加一个观察程序，根据列数更新setting.columns。但是，我意识到如果我们设置settings.columns，我们就无法通过contexte菜单添加/删除列：

有没有人有解决方案？

Answer 1

您必须将列的设置设置为数字。以下是jsbin

的工作快照

显然在主设置对象中设置type和invalidCellClassName设置适用于整个表，允许您添加或删除列，这与我在此编辑之前建议禁用添加的列级设置不同或删除列。使用整个表格的设置更新了jsbin的快照here

 function MainCtrl($scope, hotRegisterer) {
  $scope.db = [[5, 6], [7, 8]];
  $scope.settings = {
    type:  'numeric',
    invalidCellClassName: 'someCssClass'
  };
  $scope.$watch("db", function (newValue, oldValue) {
    console.log("$watch");
    var hot_instance = hotRegisterer.getInstance("mytable"); 
    $scope.data = hot_instance.getData();
  }, true)
}
MainCtrl.$inject = ['$scope', 'hotRegisterer'];

angular.module('app', ['ngHandsontable'])
  .controller('MainCtrl', MainCtrl)

并将设置添加到hot-table

  <hot-table hot-id="mytable" datarows="db" settings="settings"></hot-table>

让handsontable将数字视为数字类型

1 个答案: