2017-01-31 26 views
0

私は手錠を文字列化するコードを持っています: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メニューで任意の複数の列を追加/削除することができなかったことを実現:

enter image description here

誰もが解決策を持っていますか?

答えて

0

列の数値を数値に設定する必要があります。ここでの作業スナップショットは、あなたのjsbin

どうやらあなたは、私がこの編集前に提案され、列レベルの設定とは異なり、列を追加または削除することができ、テーブル全体に適用される主設定オブジェクトでtypeinvalidCellClassName設定を設定無効になっています列の追加または削除テーブル全体の設定を使用して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> 
+0

1に設定を追加)私は列の数を知らない、への道があります'type: 'numeric''テーブル全体を設定します。 1)この設定では、セルに文字列 'abc'を入力すると、背景色が赤色に変わることがわかります。これをどうすれば無効にできますか?私は文字列のエラーや警告を発生させたくありません。 –

+0

'invalidCellClassName'を追加すると、無効化されたセルのCSSを定義できます。したがってこれを無効にするには '{type: 'numeric'、invalidCellClassName: 'someCssClass'}'は存在しないクラス名を追加します。それをテーブル全体に設定するには、より簡単な方法が存在するかどうかはわかりませんが、 '$ scope.db'配列要素の長さを常に反復して、' $ scope.settings.columns ' – acesmndr

+0

私の更新を見てください... –

関連する問題