如何通过 Javascript 访问 QML ComboBox 中使用的 QAbstractListModel 的角色答案

【问题标题】：How to access Roles of a QAbstractListModel used in a QML ComboBox via Javascript如何通过 Javascript 访问 QML ComboBox 中使用的 QAbstractListModel 的角色
【发布时间】：2015-06-23 10:29:59
【问题描述】：

我有一个基于QAbstractListModel 的模型。

它实现了几个不同的角色来提供各种数据。

我在ComboBox 中设置了model 和textRole。这非常有效。

当用户从这个ComboBox 中选择一个项目（行）时，我需要运行一些Javascript 来读取Item 的几个不同角色的值，并使用它们来做有用的工作。

但是，我找不到任何方法来做到这一点。示例ComboBoxQML：

import QtQuick 2.4
import QtQuick.Controls 1.3

ComboBox {
    id: dropDownList
    model: myModel
    textRole: "display"
    onActivated: {
        console.log("dropDownList Activated");
        console.log("Read Model Value: " + model.display);
    }
}

我得到的控制台日志是：

qml: dropDownList Select Activated
qml: Read Model Value: undefined

display 角色值由ComboBox 本身正确显示。

我也试过model[index].display，这给了

TypeError: Cannot read property 'display' of undefined

model.get(index) 不受QAbstractListModel 支持，并且没有角色所以不适合。

我相信这一定是可能的，因为ComboBox 可以显示来自任意角色的文本。

【问题讨论】：

我打赌myModel 是一个上下文属性，不是吗？如果是这样，用Q_INVOKABLE/SLOT 方法包装data 并收集所需的角色怎么样？
BaCaRoZzo 是正确的。您需要向模型添加可调用的方法才能直接访问它。不幸的是，ComboBox 不会向您公开模型:(

标签： javascript qt combobox qml qt5.4

【解决方案1】：

您可以使用 QuickControls 2 ComboBox delegateModel 的未记录属性。

import QtQuick 2.4
import QtQuick.Controls 1.3

ComboBox {
    id: dropDownList
    model: myModel
    textRole: "display"
    onActivated: {
        console.log("dropDownList Activated");
        var currentItem = delegateModel.items.get(currentIndex)
        console.log("Read Model Value: " + currentItem.model.display);
    }
}

返回的项目是 javascript 对象，而不是 QtObjects，因此您不能在绑定中使用 delegateModel.items.get() 返回的对象，因为它没有 Qml 属性。

虽然没有记录此属性，但在设置用于自定义弹出窗口的模型时，Customizing ComboBox 示例中提到了它。

contentItem: ListView {
    clip: true
    implicitHeight: contentHeight
    model: control.popup.visible ? control.delegateModel : null
    currentIndex: control.highlightedIndex

    ScrollIndicator.vertical: ScrollIndicator { }
}

【讨论】：