0

我有一封 AMP 电子邮件,我希望复选框显示为选中或未选中,具体取决于来自我的服务器的值。如果值为{{done}}false,我希望该框未选中,如果{{done}}为 true,我希望该框选中。

这是电子邮件的代码:

               <amp-list                             
                            template="checklist-item-template"
                            src="MY_SOURCE_URL"
                            layout="responsive"
                            binding="refresh" 
                            width="600"
                            height="56"
                            ><template
                                id="checklist-item-template"
                                type="amp-mustache"
                            >
                                <div class="task-row outline">
                                    <div class="task task-checkbox">
                                        <input
                                            type="checkbox"
                                            id="checkbox-{{id}}"
                                            value="checked"
                                            name="{{id}}"
                                            [checked]="{{done}}"
                                            on="change:checklist-form.submit"
                                        />
                                    </div>
                                    <div class="task task-name">
                                        {{done}}
                                    </div>
                                    <div class="task small-text task-icons">
                                        {{deadline}}
                                    </div>
                                    <div class="task task-burger"></div>
                                </div>
                            </template>
                            <div overflow class="list-overflow">
                                See more
                            </div>
                        </amp-list>

其他动态字段正确填充。我的问题是我不能将done布尔值直接传递到checked属性中,因为false它呈现为一个字符串,它是真实的并选中该框。

我在这里找到了一个非常相似的问题。这种方法是我最初使用的并且效果很好。但是,现在无论传递给[checked]属性的值如何,我的复选框都未选中。

我怀疑 AMP 电子邮件可能正在进行一些开发,因为我遇到了类似的问题,AMP 团队最终确认这是一个错误。

4

1 回答 1

3
  • 您正在使用[checked],这是属性绑定的语法,仅在amp-bind导入时才有效。您需要添加 <script async custom-element="amp-bind" src="https://cdn.ampproject.org/v0/amp-bind-0.1.js"></script>.
    • 也许 AMP 应该向 JS 控制台打印警告以获得更好的开发人员体验,因此请考虑提交功能请求。
  • 您正在使用binding=refreshon amp-list,它告诉组件仅在刷新列表时而不是在列表的初始加载期间评估绑定。要评估[checked]初始负载,您需要binding=always或完全忽略该binding属性。
于 2021-01-11T02:58:45.373 回答