Stap 6: Triggers genereren

In deze stap wordt uitgelegd hoe de trigger wordt gegenereerd waarvan u hebt gezien dat deze is geregistreerd.

Triggers kunnen op elk punt worden gegenereerd door een component. Gewoonlijk wordt deze gegenereerd door een interactie van de gebruiker, door te klikken op een knop of een rij te selecteren in een tabel. De component kan de trigger echter genereren op basis van elk criterium, bijvoorbeeld wanneer gegevens zijn gewijzigd door een REST-aanroep.

Als u in dit scenario op de afbeelding klikt, wordt een trigger gegenereerd waarmee de huidige waarde van de eigenschap whoAreYou wordt doorgegeven.

Zoek in het bestand render.js naar het object SampleComponentViewModel.

U genereert een trigger als volgt:

1. Zoek de functie in het object SampleComponentViewModel waarmee de Sites-SDK wordt aangeroepen om de trigger te genereren.

   self.raiseTrigger = function (triggerName) {
     SitesSDK.publish(SitesSDK.MESSAGE_TYPES.TRIGGER_ACTIONS, {
       'triggerName': triggerName, 
       'triggerPayload': { 
           'payloadData': 'some data here'
       }
     });
   };

2. Nu moet u een item aan de gebruikersinterface toevoegen om de functie aan te roepen waarmee de trigger wordt gegenereerd. Zoek in het bestand render.js naar het object sampleComponentTemplate en werk dit bij met dit item:

        '<div data-bind="attr: {style: imageStyle, \'data-layout\': alignImage()}, click: imageClicked">' +

In het object SampleComponentViewModel ziet u de JavaScript-functie die wordt aangeroepen wanneer op de afbeelding wordt geklikt. Deze functie roept de Sites-SDK aan om alle acties te genereren die zijn gedefinieerd voor de trigger imageClicked. De trigger vertegenwoordigt de waarde die is doorgegeven via de click-binding in stap 2. Er wordt ook een triggerPayload doorgegeven met één veld: payloadData. Daarbij wordt de statische waarde 'some data here' doorgegeven. De waarden imageClicked en whoAreYou komen overeen met de waarden in het bestand appinfo.json waarin de trigger is geregistreerd (in de vorige stap).

In de voorbeeldcode wordt de trigger gegenereerd door een gegevensbinding van de click-binding en wordt de triggernaam imageClicked doorgegeven. Er zijn drie renderings van de component <scs-image> op basis van de lay-out die de gebruiker kiest. U kunt ervoor zorgen dat de trigger voor elke lay-out wordt gegenereerd door de onderstaande wijzigingen aan te brengen in het bestand render.js.

• Genereer triggers op basis van verschillende lay-outs. Zoek de twee voorvallen van deze code:

  '<div data-bind="attr: {style: imageStyle, \'data-layout\': alignImage()}">' +

  Wijzig de code als volgt:

  '<div data-bind="attr: {style: imageStyle, \'data-layout\': alignImage()}, click: imageClicked">' +

• Geef de payload op om de triggers door te geven. Wijzig deze code:

      self.raiseTrigger = function (triggerName) {
        SitesSDK.publish(SitesSDK.MESSAGE_TYPES.TRIGGER_ACTIONS, {
          'triggerName': triggerName,
          'triggerPayload': {
            'payloadData': 'some data here'
          }
        });
      };

  Gebruik in plaats daarvan deze code:

      self.raiseTrigger = function (triggerName) {
        SitesSDK.publish(SitesSDK.MESSAGE_TYPES.TRIGGER_ACTIONS, {
          'triggerName': triggerName,
          'triggerPayload': {
            'payloadData': self.imageBannerText() // pass banner text as payload
          }
        });
      };

• Synchroniseer of upload het bestand render.js naar de server van de Oracle Content Management instance.

Nu u de vereiste code hebt gecontroleerd, kunt u de trigger koppelen zodat deze door uw aangepaste component wordt gegenereerd wanneer u op de knop klikt.