如何为 Discourse Subscriptions 插件中的计划按钮添加唯一的 CSS 标识符

开发
1

我想修改 这个 模板，让每个支付选项都带上一个我可以用来单独修改按钮的类名。目前看来，似乎没有方法可以单独定位这些计划按钮。如果我的理解有误，请告诉我。

基本上，我希望确保下面的代码中每个 payment-plan 都带有自己的类名，例如 button1 或 button2 之类的。

<div class="subscribe-buttons">
  {{#each orderedPlans as |plan|}}
    {{payment-plan plan=plan selectedPlan=selectedPlan clickPlan=(action "clickPlan")}}
  {{/each}}
</div>
2

已经解决了，供感兴趣的朋友参考。Ember.js 有一个很棒的特性，可以在循环中获取索引，同时还有一个辅助函数可以将该索引与字符串拼接：

<script type="text/x-handlebars" data-template-name="javascripts/components/payment-options">
    <p>
        {{i18n "discourse_subscriptions.plans.select"}}
    </p>
    
    <div class="subscribe-buttons">
        {{#each orderedPlans as |plan i|}}
            {{payment-plan plan=plan selectedPlan=selectedPlan clickPlan=(action "clickPlan") elementId=(concat 'button' i)}}
        {{/each}}
    </div>
</script>
1 个赞