각도 격자 (레이아웃 용) 및 각도 웨비 닉스 (위젯 생성 용)를 사용하여 대시 보드 레이아웃을 만들려고합니다. 필자가 직면 한 한 가지 문제는 대시 보드 페이지가 나타나면 내부적으로 모든 위젯을 두 번 다시 렌더링 할 때 Webix 위젯이 두 번 초기화된다는 것입니다. 응용 프로그램의 작은 샘플은 사람이 이유 또는 이것에 대한 어떤 수정을 줄 수 아래의 바이올린 링크각도 그리드 스터와 함께 사용할 때 Webix 위젯이 두 번 인스턴스화되는 경우
<body>
<div ng-controller="SampleController">
<div gridster="gridsterOptions">
<div class="widget-container" gridster-item="widget" ng-repeat="widget in widgets">
<div webix-ui="widget" webix-ready='resize(root)'></div>
</div>
</div>
</div>
</body>
$(function() {
webix.protoUI({
"name": "SampleWidget",
$init: function(config) {
alert("In $init");
this.$view.className = config.css;
this.$view.innerHTML = "Hai";
}
}, webix.MouseEvents, webix.EventSystem, webix.ui.view);
//Initialising app
var webixApp = angular.module('webixApp', ['webix', 'gridster']);
var gridsterOptions = {
columns: 12,
margins: [10, 10],
outerMargin: false,
mobileBreakPoint: 600,
width: 'auto',
colWidth: 'auto',
minSizeY: 15,
minSizeX: 2,
rowHeight: 10
};
//controller
webixApp.controller('SampleController', function($scope, $timeout) {
$scope.gridsterOptions = gridsterOptions;
$scope.widgets = [{
view: 'SampleWidget',
id: 'Sample',
css: 'sample-widget'
}];
});
angular.bootstrap($("body"), ["webixApp"]);
});
https://jsfiddle.net/rajisht/L3a3k624/
에서 사용할 수 있습니까?