AngularJSで実データのないデータ結合を設定すると、セル領域が描画されない

文書番号 : 39627 文書種別 : 不具合登録日 : 2016/10/04 最終更新日 : 2016/10/04

対象製品

SpreadJS 9J

発生環境

3.20152.19

状況

修正済み

詳細

AngularJSで実データのないデータ結合を設定すると、SpreadJSのセル領域が描画されない現象が発生します。

【再現手順】
1.以下のコードを実行します

【現象】
SpreadJSのセル領域が描画されない現象が発生します。

【再現コード】
<!DOCTYPE html>
<html ng-app="SpreadApp">
　　<head>
　　　　<title>Sample</title>
　　　　<script src="https://code.jquery.com/jquery-2.1.4.min.js" type="text/javascript"></script>
　　　　<script src="http://code.jquery.com/ui/1.11.4/jquery-ui.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>
　　　　<link href="http://cdn.grapecity.com/spreadjs/32015219/css/spread.3.20152.19.css" rel="stylesheet" type="text/css" />
　　　　<script src="http://cdn.grapecity.com/spreadjs/32015219/scripts/spread.all.3.20152.19.min.js" type="text/javascript"></script>
　　　　<script src="http://cdn.grapecity.com/spreadjs/32015219/scripts/interop/angular.spread.3.20152.19.min.js" type="text/javascript" ></script>
　　　　
　　　　<script type="text/javascript">
　　　　 var app = angular.module('SpreadApp', ['wijspread']);
　　　　 app.controller('appCtrl', function ($scope, $http) {
　　　　　　 angular.element(document).ready(function() {
　　　　　　 });
　　　　 });
　　　　</script>
　　</head>
　　
　　<body oncontextmenu="return false">
　　　　<div class="main" ng-controller="appCtrl">
　　　　　　<div class="spread">
　　　　　　　　<wij-spread id="spd" style="width:400px; height:200px">
　　　　　　　　　　<sheets>
　　　　　　　　　　　　<sheet datasource="data">
　　　　　　　　　　　　　　<columns>
　　　　　　　　　　　　　　　　<column datafield="a" headertext="A"></column>
　　　　　　　　　　　　　　　　<column datafield="b" headertext="B"></column>
　　　　　　　　　　　　　　　　<column datafield="c" headertext="C"></column>
　　　　　　　　　　　　　　</columns>
　　　　　　　　　　　　</sheet>
　　　　　　　　　　</sheets>
　　　　　　　　</wij-spread>
　　　　　　</div>
　　　　</div>
　　</body>
</html>

回避方法

SpreadJS 9J SP1(3.20152.21)で修正済み。
SpreadJS 9J SP1(Ver.3.20152.21)より前のバージョンでは次の回避方法が有効です。
------------------------------------------
SpreadJSへ空のデータを設定を行います。

【再現コードへの回避策適用例】
--------------------------------------------------
<script type="text/javascript">
var app = angular.module('SpreadApp', ['wijspread']);
app.controller('appCtrl', function ($scope, $http) {
　　 angular.element(document).ready(function() {
　　　　 //回避策：空のデータ設定を行います
　　　　 $scope.data = [];
　　　　 $scope.$apply();
　　 });
});
</script>
--------------------------------------------------