Table API – qlik.table – Angular шаблон

Пространство имен :qlik.table

API таблиц – это способ для разработчиков создавать таблицы с использованием измерений и метрик, которые возвращаются в стандартном формате таблицы строк и столбцов. В отличие от формата qHyperCube, который возвращает данные в объектном формате, Table API можно просто использовать, например, для выполнения следующих действий: 

• Подготовка выгрузки в Excel
• Визуализация простой табличной информации в Angular шаблоне

qlik.app.createTable Метод является точкой входа в таблицу API. Он создает tableобъект, который оборачивает qHyperCube и возвращает табличный объект типа  QTable.

---

Свойства объекта QTable следующие:

имя	Тип	Описание
rows	Array.QRow	Строки данных
headers	Array.QHeader	Заголовок информации
totals	Array.QMeasureCell	Общая информация для мероприятий
rowCount	Number	Общее количество строк для qHyperCube, включая строки, не выбранные с сервера
colCount	Number	Общее количество столбцов для qHyperCube

Первоначально он пуст, но в конечном итоге будет содержать данные. Объект таблицы будет обновляться при изменении состояния выбора, а уведомление будет отправлено, когда данные будут доступны, и будет запускаться при каждом обновлении. Чтобы получить уведомление, привяжите слушателя  к  экземпляру OnData QTable

Ниже приведен пример создания таблицы и ее рендеринга с использованием простого шаблона AngularJS, поскольку он оптимален для рендеринга динамических таблиц на экране:

Шаг 1. Создайте таблицу и добавьте в нее слушателя:

var table = app.createTable(["FirstName", "LastName"], ["Count(Case Id)"],{rows:200}); 
var listener = function() { 
    var rowCount = table.rowCount; 
    var colCount = table.colCount; 
    table.OnData.unbind( listener ); //unregister the listener when no longer notification is needed.  
}; 
table.OnData.bind( listener ); //bind the listener

Шаг 2: Добавьте следующий фрагмент кода в скрипт основного контроллера:

if ( !this.$scope.table ) {
    var app = qlik.currApp(); 
    this.$scope.table = app.createTable(["FirstName", "LastName"], ["Count(Case Id)"],{rows:200}); 
}

Шаг 3. Определите шаблон AngularJS, используя следующий HTML-код:

<tr ng-repeat="row in table.rows">//Render rows     
    <td ng-repeat="cell in row.cells"> {{cell.qText}} </td>; //Render cells within row
</tr>

---

Источник: https://www.oreilly.com/library/view/mastering-qlik-sense/9781783554027/02b928a4-eea4-4545-9718-459ff0c097af.xhtml