QML Binding with Javascript array access to QObject Property

Question

My rootModel has property called checklist. checklist is QObject that has bool properties that needs to be controlled by a Checkbox {}. I'm trying to reduce copy and paste code. Below is my custom checkbox MyCheckbox.qml

import QtQuick.Controls 1.0
import QtQuick 2.0    

Checkbox {
    id: myCheckbox
    property string property: ""


    Binding {
        target: myCheckbox
        property: "checked"
        value: rootModel.checklist[property]
    }

    checked: rootModel.checklist[property]
    onCheckedChanged: rootModel.checklist[property] = checked
}

Example of usage of MyCheckbox.qml:

import QtQuick 2.0

Item {

   Row {  
      MyCheckbox {
           property: "check1" //Access to rootModel.checklist.check1
      }

      MyCheckbox {
           property: "check2" //Access to rootModel.checklist.check2
      }
   }
}

It get the following error for the Binding{}:

QQmlExpression: Expression file:///myChecklistCheckbox.qml:14:16 depends on non-NOTIFYable properties:
      QQmlBind::property

How do I fix this error and get the QmlEngine to bind the property properly. checklist has signals for each property and NOTIFY works correctly if do something like this:

    Binding {
        target: myCheckbox
        property: "checked"
        value: rootModel.checklist.check1
    }

perencia perencia · Accepted Answer · 2016-05-14T21:06:36

As presented in this page you can do something like this:

CheckBox {
    id: myCheckbox
    property string property: ""

    checked:  rootModel.checklist[property]
    onCheckedChanged: {rootModel.checklist[property] = checked; rebind();}

    function rebind() {
        checked = Qt.binding(function(){ return rootModel.checklist[property]})
    }
}

QML Binding with Javascript array access to QObject Property

1 Answers