QML model link to JSON data - json

Question

How to link a JSON stream to a QML model like you would do with angularJS?
In my QML, I have a Websocket object that receives data from a server:
WebSocket {
id: socket
url: "ws://3.249.251.32:8080/jitu"
onTextMessageReceived: { var jsonObject = JSON.parse(message) }
onStatusChanged:
if (socket.status == WebSocket.Error) { console.log("Error: " + socket.errorString) }
else if (socket.status == WebSocket.Open) { console.log("Socket open"); }
else if (socket.status == WebSocket.Closed) { console.log("Socket closed"); }
active: false
}
In this JSON I have something like:
{ items: [ "FOO", "BAR" ] }
Then I want to display two tabs, on titles FOO and the other, unsurprisingly, titled BAR.
This work great if I create a repeater that goes through the array in my model and create a tab for each entry:
TabView {
anchors.fill: parent
Repeater {
model: ListModel { id: tabs }
Tab {
title: Caption
Rectangle { color: "red" }
}
}
}
Up to now, this really looks like angularJs. I just need now to update my model (scope for angular) with the data received through the websocket.
For this, I have to add the tabs from my JSON to the ListModel as such:
...
onTextMessageReceived: {
var jsonObject = JSON.parse(message)
tabs.append(jsonObject.ITU.Modalities);
}
...
The problem is, each time I'll receive an update from JSON, tabs will be added. I don't want to clear the ListView each time, that would be time consuming I think. Is there a smart way to update the model from JSON smartly ? In angular, as they are both javascript structure, they are easy to merge. But here, I don't see an easy way.