Sails バックエンド (sails-mysql アダプターを使用) から ui-grid にデータを取り込む角度のあるフロントエンドがあります。このデータセットは大きいため、ページにデータが含まれているように見えるようになるまで、読み込みに時間がかかります。
セイルからのストリーミングの基本は次のとおりです。
findAllStream: function (req, res) {
Model.stream().pipe(res);
}
ここまでは、モデルからフロントエンドに個々のデータをストリーミングします。このストリームを消費するために angular-oboe を使用しています:
vm.myData = [];
var obj = {};
var count = 0;
Oboe({
url: '/api/model/findAllStream',
pattern: '*',
start: function(stream) {
// handle to the stream
vm.stream = stream;
vm.status = 'started';
},
done: function(parsedJSON) {
vm.status = 'done';
}
}).then(function() {
// promise is resolved
console.log('done');
}, function(error) {
// handle errors
console.log('error');
}, function(node) {
// node received
switch (count) {
case 0:
obj['id'] = node;
break;
case 1:
regObj['property'] = node;
break;
case 2:
regObj['function'] = node;
break;
}
if (++count === 3) {
vm.myData.push(regObj);
count = 0;
obj = {};
}
});
基本的に、データのノードは同じ順序で来るように見えるので、受け取ったノードの数を追跡し、そのようにオブジェクトを構築します。次に、各オブジェクトを配列にプッシュして、uigrid で使用できるようにします。
たとえば、find() によって返されるデータは次のようになります。
[
{
id: 1,
property: foo,
function: bar
},
{
id: 2,
property: stuff,
function: things
}
]
これは、angular および uigrid でうまく機能します。しかし、ストリームを使用すると、次のようになります。
1
foo
bar
2
stuff
things
特にモデルが変更された場合、これは理想的ではありません。値だけでなくキーを送信する方法はありますか? それとも、ストリームから JSON を送信しますか? 何かのようなもの:
id: 1,
property: foo,
function: bar
id: 2,
property: stuff,
function: things
ありがとう!