Na konci tejto sekcie budete môcť zadať hodnotu pre novú vlastnosť na paneli Nastavenia a pozrieť si, ako táto nová hodnota zmenila vlastný komponent. Na stránku sa budú automaticky ukladať aj aktualizácie vlastnosti.
render.js je potrebné aktualizovať objekty JavaScript v komponente:
SampleComponentViewModel
sampleComponentTemplate
Upravte súbor render.js a aktualizujte komponent SampleComponentViewModel tak, aby zahŕňal novú vlastnosť. Zmeňte túto vlastnosť:
self.showStoryLayout = ko.observable();
Namiesto nej použite:
self.showStoryLayout = ko.observable(); self.imageBannerText = ko.observable();
Aktualizujte objekt SampleComponentViewModel, aby sa prejavili zmeny hodnôt. Zmeňte túto vlastnosť:
self.imageWidth(customData && customData.width);
Namiesto nej použite:
self.imageWidth(customData && customData.width); self.imageBannerText(customData && customData.imageBannerText);
Zmeňte objekt sampleComponentTemplate tak, aby zobrazoval novú vlastnosť. Zmeňte túto vlastnosť:
'<div data-bind="text: \'image width is: \' + imageWidth()"></div>' +
Namiesto nej použite:
'<div data-bind="text: imageBannerText"></div>' +
Komponent synchronizujte alebo nahrajte na server Oracle Content Management.
Komponent je teraz upravený tak, aby zobrazoval novú vlastnosť. Na rozdiel od panela Nastavenia, ktorý je na stránke vložený v ráme, komponent je vložený priamo na stránke. Oblasť komponentu sa preto bude automaticky zväčšovať úmerne tomu, ako sa bude zväčšovať komponent.
Kontrola výsledkov pre krok 4
Ako zobraziť novú vlastnosť:
Obnovte stránku na vašej lokalite, aby generátor lokalít mohol načítať zmeny v komponente.
Otvorte stránku v režime úprav.
Myšou presuňte komponent na stránku.
Otvorte panel Nastavenia pre váš komponent.
Kliknite na tlačidlo Vlastné nastavenia.
Položku Image Banner zmeňte na Workspace.
Zmenu komponentu na stránke na Workspace uvidíte nad obrázkom.
Pokračujte na Krok 5: Registrácia spúšťačov.