2017-01-31 11 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) 

Однако, если поставить новый числовое значение в таблице, это будет рассматриваться как строки в массиве, который не совпадает с другим значением формат массива.

Я не знаю, почему handontbale обрабатывает все значения ячеек как строковые типы по умолчанию. Есть ли способ настройки таким образом, чтобы новое значение numeric обрабатывалось как числовое тип?

Редактировать 1: После ответа от @acesmndr, я сделал this. И я хотел добавить наблюдателя в db для обновления setting.columns в соответствии с количеством столбцов. Тем не менее, я понимаю, что, если мы устанавливаем settings.columns, мы не могли бы добавить/удалить столбцы больше по меню contexte:

enter image description here

Кто-нибудь есть решение?

ответ

0

Вы должны установить параметры для столбцов как числовые. Вот рабочий снимок 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> 
+0

1) Я не знаю, число столбцов, есть способ установить всю таблицу 'type: 'numeric''; 1) в этой настройке я понимаю, что когда мы вводим строку «abc» в ячейке, цвет фона меняется на красный, как я могу отключить это? Я не хочу поднимать никаких ошибок или предупреждений о строках. –

+0

Вы можете добавить 'invalidCellClassName', чтобы определить css для недействительной ячейки. Поэтому, чтобы отключить это, добавьте к нему имя класса, которое не существует '{type: 'numeric', invalidCellClassName: 'someCssClass'}'. Чтобы установить его во всю таблицу, я не знаю, существует ли какой-либо более простой способ, но вы всегда можете перебирать длину массива '$ scope.db', ​​чтобы создать массив объектов для' $ scope.settings.columns ' – acesmndr

+0

Пожалуйста, см. Мое обновление ... –