Sisällön asettelun kehittäjän on vakioitava sisällön asettelun vastaanottamien tietojen rakenne.
Jos kaikki tiedot ovat mukana, sisällön asettelu voi yksinkertaisesti muodostaa komponentin. Jos kaikki tiedot eivät ole mukana, sisällön asettelun on ehkä tehtävä ylimääräisiä kyselyitä. Joka tapauksessa sisällön asettelu ei voi koskaan olettaa tietojen olevan tietyssä muodossa, vaan sen on pakotettava tiedot muotoon, jonka voi muodostaa.
Tämä varmistaa, että kaikki odotetut tiedot ovat käytettävissä. Jos tietoja ei ole, on tehtävä ylimääräisiä kyselyitä. Seuraavat kentät saattavat puuttua tiedoista:
Viitattujen kenttien "fields"-merkintä
Suuret tekstikentät
Koska sisällön asettelut on suunniteltu tietyille sisältötyypeille, sisällön asettelun kehittäjä tietää tarvittavat kentät. Tiedot on haettava jokaiselle näistä kentistä, jotta sisällön asettelu voidaan muodostaa. Vaihtoehtoja on kaksi: puuttuvat tiedot voi noutaa, jolloin muodostus tehdään täydellisillä tiedoilla, tai muodostus tehdään välittömästi ja tyhjät kohdat täytetään hakemalla puuttuvat tiedot.
Vaihtoehto 1: puuttuvat tiedot haetaan ja muodostus tehdään täydellisillä tiedoilla
Luo lupaus tarvittavien tietojen hausta ja jatka sitten muodostusta, kun kaikki lupaukset palautuvat.
Oletetaan esimerkiksi, että käytössä ovat seuraavat sisältötyypit ja vastaavat kentät:
starter-blog-author
kentät
starter-blog-author_name - tekstikenttä
starter-blog-author_bio - tekstikenttä
starter-blog-post
kentät
starter-blog-post_title - tekstikenttä
starter-blog-post_content - suuri tekstikenttä
starter-blog-post_author - viittaus starter-blog-author-kohteeseen
Sisällön asettelulla on seuraava mallipohja, joka muodostaa nämä odotetut kenttien arvot:
{{#fields}}
<div class="blog_container">
<div class="blog-post-title">{{starter-blog-post_title}}</div>
{{#starter-blog-post_author.fields}}
<div class="blog-author-container">
<div class="blog-author-details">
<div class="blog-author-name">{{starter-blog-author_name}}</div>
<div class="blog-author-bio">{{{starter-blog-author_bio}}}</div>
<span class="more-from-author">More articles from this author</span>
</div>
</div>
{{/starter-blog-post_author.fields}}
<div class="blog-post-content">{{{starter-blog-post_content}}}</div>
</div>
{{/fields}}
Sisällön asettelua voi kutsua tietojen kanssa seuraavista kyselyistä:
Kohdekysely "expand"-arvolla - kaikki määritetyt tiedot
/content/published/api/v1.1/items/{id}?expand=fields.starter-blog-post_author&channelToken=8dd714be0096ffaf0f7eb08f4ce5630f
Tämä on tietojen muoto, jota tarvitaan, jotta kaikki mallipohjan arvot voidaan täyttää. Jos jompaakumpaa toisista kyselyistä käytetään, tietojen hakuun ja tähän muotoon muuntamiseen tarvitaan lisätyötä.
"fields": {
"starter-blog-post_title": "...",
"starter-blog-post_summary": "...",
"starter-blog-post_content": "...",
"starter-blog-post_author": {
"id": "CORE386C8733274240D0AB477C62271C2A02",
"type": "Starter-Blog-Author"
"fields": {
"starter-blog-author_bio": "...",
"starter-blog-author_name": "..."
}
}
}Kohdekysely ilman "expand"-arvoa - viitatut kohdekentät "starter-blog-post_author.fields" puuttuvat:
/content/published/api/v1.1/items/{id}?channelToken=8dd714be0096ffaf0f7eb08f4ce5630f"fields": {
"starter-blog-post_title": "...",
"starter-blog-post_summary": "...",
"starter-blog-post_content": "...",
"starter-blog-post_author": {
"id": "CORE386C8733274240D0AB477C62271C2A02",
"type": "Starter-Blog-Author"
}
}SCIM-kysely - suuri tekstikenttä "starter-blog-post_content" sekä viitatut kohdekentät "starter-blog-post_author.fields" puuttuvat:
/content/published/api/v1.1/items?q=(type eq "Starter-Blog-Post")&fields=ALL&channelToken=8dd714be0096ffaf0f7eb08f4ce5630f
"fields": {
"starter-blog-post_title": "...",
"starter-blog-post_summary": "...",
"starter-blog-post_author": {
"id": "CORE386C8733274240D0AB477C62271C2A02",
"type": "Starter-Blog-Author"
}
}Näiden kyselyiden yhdenmukainen muodostus edellyttää, että sisällön asettelun render.js-tiedosto laajentaa kaikki viitatut kentät ja että suuret tekstikentät ovat mukana.
Jos näin ei ole, sen on palautettava kysely, korjattava tiedot ja tehtävä sitten muodostus täydellisillä tiedoilla.
Esimerkki render()-funktiosta:
render: function (parentObj) {
var self = this,
template,
contentClient = self.contentClient,
content = self.contentItemData;
var getRefItems = function (contentClient, ids) {
// Calling getItems() with no "ids" returns all items.
// If no items are requested, just return a resolved Promise.
if (ids.length === 0) {
return Promise.resolve({});
} else {
return contentClient.getItems({
"ids": ids
});
}
};
var fetchIDs = [], // list of items to fetch
referedFields = ['starter-blog-post_author'], // names of reference fields
largeTextFields = ['starter-blog-post_content'], // large text fields in this asset
fieldsData = content.fields;
// See if we need to fetch any referenced fields
referedFields.forEach(function (fieldName) {
if(fieldsData[fieldName] && fieldsData[fieldName].fields) {
// got data already, nothing else to do
} else {
// fetch this item
fetchIDs.push(fieldsData[fieldName].id);
}
});
// See if we need to fetch any large text fields
for(var i = 0; i < largeTextFields.length; i++) {
if(!fieldsData[largeTextFields[i]]) {
// need to fetch this content item directly to get all the large text fields
fetchIDs.push(content.id);
break;
}
}
// now we have the IDs of all the content items we need to fetch, get them all before continuing
getRefItems(contentClient, fetchIDs).then(function (referenceData) {
var items = referenceData && referenceData.items || [];
// add the data back in
items.forEach(function (referencedItem){
// check if it's the current item
if(referencedItem.id === content.id) {
// copy across the large text fields
largeTextFields.forEach(function (fieldName) {
fieldsData[fieldName] = referencedItem.fields[fieldName];
});
} else{
// check for any referenced fields
for (var i = 0; i < referedFields.length; i++) {
if(referencedItem.id === fieldsData[referedFields[i]].id){
// copy across the fields values
fieldsData[referedFields[i]].fields = referencedItem.fields;
break;
}
}
}
});
// now data is fixed up, we can continue as before
try{
// Mustache
template = Mustache.render(templateHtml, content);
if(template) {
$(parentObj).append(template);
}
} catch (e) {
console.error(e.stack);
}
});
}Vaihtoehto 2: muodostus tehdään välittömästi ja tyhjät paikat täytetään sitten hakemalla puuttuvat tiedot
Suorituskykyä voi ehkä parantaa erottamalla kohteet, jotka eivät kenties ole mukana, ja muodostamalla ne toisessa vaiheessa. Tähän tarvitaan kaksi Mustache-mallipohjaa. Ensimmäinen niistä suorittaa ensimmäisen muodostuksen ja jättää aukkoja, jotka toinen muodostus täyttää, kun tiedot ovat valmiit.
Tämä edellyttää Mustache-mallipohjan määritystä siten, että se tukee useita vaiheita. Tämän voi tehdä joko käyttämällä erillisiä mallipohjia aukoille tai määrittämällä mallin palauttamaan mallipohjamakroja varsinaisten arvojen sijaan. Kummassakin tapauksessa aukot on piilotettava, kunnes tiedot haetaan. Ne on täytettävä ja näytettävä asianmukaisella käyttöliittymäanimaatiolla, jotta sivu ei heittelehtisi liikaa.