呈現沒有選擇器的HTML選件

Last update: Fri Feb 13 2026 00:00:00 GMT+0000 (Coordinated Universal Time)

建立對象：

開發人員

當您的主張包含HTML內容，但您必須提供套用它的位置（選取器），以及如何套用它（動作型別）時，請使用此模式。您可以呼叫applyPropositions，並將metadata物件加入範圍鍵中，以執行此操作。支援的actionType值為setHtml、replaceHtml和appendHtml。

1.管理忽隱忽現的情形（選擇性）

如果您在呈現內容時隱藏內容，您有責任在呈現完成後顯示內容。如需詳細資訊，請參閱管理閃爍。

2.要求您欲轉譯之範圍的主張

alloy("sendEvent", {
  personalization: {
    decisionScopes: ["discount", "salutation"]
  },
  xdm: { }
}).then(({ propositions = [] }) => {
  // Render in the next step
});

如需詳細資訊，請參閱personalization.decisionScopes。

3.呈現具有`applyPropositions`中繼資料的選件

alloy("sendEvent", {
  personalization: {
    decisionScopes: ["discount", "salutation"]
  },
  xdm: { }
}).then(({ propositions = [] }) => {
  return alloy("applyPropositions", {
    propositions,
    metadata: {
      salutation: {
        selector: "#salutation",
        actionType: "setHtml"
      },
      discount: {
        selector: "#daily-special",
        actionType: "replaceHtml"
      }
    }
  }).then(({ propositions: renderedPropositions = [] }) => {
    return { renderedPropositions };
  });
});

4.記錄呈現之主張的顯示事件

呼叫applyPropositions時未自動傳送顯示事件。轉譯完成之後，請使用參考轉譯後主張的sendEvent呼叫：

function toDisplayPayload(propositions) {
  return propositions.map((p) => ({
    id: p.id,
    scope: p.scope,
    scopeDetails: p.scopeDetails
  }));
}

alloy("sendEvent", {
  personalization: {
    decisionScopes: ["discount", "salutation"]
  },
  xdm: { }
}).then(({ propositions = [] }) => {
  return alloy("applyPropositions", {
    propositions,
    metadata: {
      salutation: { selector: "#salutation", actionType: "setHtml" },
      discount: { selector: "#daily-special", actionType: "replaceHtml" }
    }
  }).then(({ propositions: renderedPropositions = [] }) => {
    return alloy("sendEvent", {
      xdm: {
        _experience: {
          decisioning: {
            propositions: toDisplayPayload(renderedPropositions),
            propositionEventType: { display: 1 }
          }
        }
      }
    });
  });
});

如需詳細資訊，請參閱管理顯示事件。

TIP

如果您使用最上層與最下層頁面事件，此「記錄顯示」呼叫通常會在最下層sendEvent呼叫中實作。

5.重新呈現

如果您的實作需要稍後重新呈現（例如在單頁應用程式中），請使用相同的主張和中繼資料再次呼叫applyPropositions：

alloy("applyPropositions", {
  propositions,
  metadata: {
    discount: { selector: "#daily-special", actionType: "replaceHtml" }
  }
});

如果您需要為該重新轉譯器錄製顯示事件，請參閱管理顯示事件。

recommendation-more-help

1ae86b30-e55e-49c1-ab11-9d0356a5f3e1