addRows()メソッドの使用によりAjaxDataViewのsubscribeが二回実行される

文書番号 : 40111 文書種別 : 不具合登録日 : 2017/03/03 最終更新日 : 2017/03/29

対象製品

SpreadJS 9J

発生環境

9.20161.0

状況

修正済み

詳細

データ件数が０の場合に、AngularJSでSpreadJSに設定した列名が表示されない現象が発生します。

【再現方法】
1.下記の再現コードを実行します
2.ページ上にあるボタンを押下して、SpreadJSに行を追加します

【動作結果】
行の追加1回に対して、二回、subscribeで変更が検知されます

【再現コード】
<!DOCTYPE html>
<html ng-app="SpreadApp">
<head>
　　<meta name="spreadjs culture" content="ja-jp" />
　　
　　<script src="https://code.jquery.com/jquery-2.1.4.min.js" type="text/javascript"></script>

　　
　　<script type="text/javascript" src="https://code.angularjs.org/1.2.22/angular.min.js"></script>
　　<script type="text/javascript" src="https://code.angularjs.org/1.2.22/angular-route.min.js"></script>

　　
　　<script type='text/javascript' src='http://ajax.aspnetcdn.com/ajax/knockout/knockout-3.1.0.js'></script>

　　
　　<script type='text/javascript' src='http://cdn.wijmo.com/jquery.wijmo-open.all.3.20153.83.min.js'></script>
　　<script type='text/javascript' src='http://cdn.wijmo.com/jquery.wijmo-pro.all.3.20153.83.min.js'></script>
　　<script type='text/javascript' src='http://cdn.wijmo.com/interop/wijmo.data.ajax.3.20153.83.min.js'></script>

　　
　　<link href="http://cdn.grapecity.com/spreadjs/9201610/css/gc.spread.sheets.excel2013white.9.20161.0.css" rel="stylesheet" type="text/css" />
　　<script type="text/javascript" src="http://cdn.grapecity.com/spreadjs/9201610/scripts/gc.spread.sheets.all.9.20161.0.min.js"></script>
　　<script type="text/javascript" src="http://cdn.grapecity.com/spreadjs/9201610/scripts/interop/angular.gc.spread.sheets.9.20161.0.min.js"></script>
　　<script type="text/javascript" src="http://cdn.grapecity.com/spreadjs/9201610/scripts/resources/ja/gc.spread.sheets.resources.ja.9.20161.0.min.js"></script>
　　<script type="text/javascript">
　　　　var app = angular.module('SpreadApp', ['gcspreadsheets']);
　　　　app.controller('appCtrl', function ($scope, $http) {
　　　　　　$scope.appDataDS = getAjaxDataView($http);
　　　　　　angular.element(document).ready(function () {
　　　　　　　　$scope.appDataDS.subscribe(function (context) {
　　　　　　　　　　spread = $("#spd").data('workbook');
　　　　　　　　　　sheet = spread.getSheet(0);
　　　　　　　　　　console.log("二行の追加に対し4回変更が検知されます");
　　　　　　　　}, 1);
　　　　　　})
　　　　})
　　　　function insRow() {
　　　　　　spread = $("#spd").data('workbook');
　　　　　　sheet = spread.getSheet(0);
　　　　　　var row = sheet.getRowCount();
　　　　　　sheet.addRows(0, 2);
　　　　}
　　　　var url = "http://localhost:64051/DATA.json";
　　　　function getAjaxDataView($http) {
　　　　　　view = new wijmo.data.AjaxDataView(url, {
　　　　　　　　ajax: {
　　　　　　　　　　method: 'GET',
　　　　　　　　　　dataType: "json"
　　　　　　　　}
　　　　　　});
　　　　　　view.refresh();
　　　　　　return view;
　　　　}
　　</script>
</head>
<body>
　　<div class="main" ng-controller="appCtrl">
　　　　<gc-spread-sheets id="spd" style="height:400px">
　　　　　　<worksheets>
　　　　　　　　<worksheet datasource="appDataDS" name="app" datasourceDeepWatch="false">
　　　　　　　　　　<columns>
　　　　　　　　　　　　<column datafield="Type1" headertext="Type1" width="100" resizable="false">
　　　　　　　　　　　　　　<default-style locked="false">
　　　　　　　　　　　　　　　　<combobox-cell-type editorValueType="value">
　　　　　　　　　　　　　　　　　　<item value="1" text="A"></item>
　　　　　　　　　　　　　　　　　　<item value="2" text="B"></item>
　　　　　　　　　　　　　　　　</combobox-cell-type>
　　　　　　　　　　　　　　</default-style>
　　　　　　　　　　　　</column>
　　　　　　　　　　</columns>
　　　　　　　　</worksheet>
　　　　　　</worksheets>
　　　　</gc-spread-sheets>
　　</div>
　　<input type="button" style="width:100px" value="Insert" onclick="insRow()" />
</body>
</html>

【DATA.jsonの内容】
[
　{
　　"Type1": "1",
　},
　{
　　"Type1": "2",
　},
　{
　　"Type1": "1",
　}
]

回避方法

SpreadJS 9J SP2(Ver.9.20171.0)で修正済み