accelerated-mobile-page - 点击：AMP.setState 无法间歇性工作

Question

tap:AMP.setState 有时不工作，但当我重新加载页面时它工作。

<div class="padTop20">
    <a [class]="model.nextStep.expand ? 'hide' : 'show'" role="button" class="show" on="tap:AMP.setState({model:{nextStep:{expand: true}}})" id="showmore">Show more</a>
    <a [class]="model.nextStep.expand ? 'show' : 'hide'" role="button" class="hide" on="tap:AMP.setState({model:{nextStep:{expand: false}}})" id="showless">Show less</a>
</div>

这是我的默认状态：

<amp-state id="model">
        <script type="application/json">
            {              
               "nextStep":{  
                  "expand":false
               }
            }
        </script>
    </amp-state>

是因为网络使它表现得像这样吗？感谢任何帮助！谢谢！

Answer 1

你应该试试;

[class]="(model.nextStep.expand == 'true') ? 'hide' : 'show'"

和

[class]="(model.nextStep.expand == 'false') ? 'show' : 'hide'"

在页面加载时，一旦加载了 DOM，就会触发初始状态 (false)，并且由于 amp-bind 而呈现 [class]。

您没有发布太多关于 AMP 可能遇到的控制台错误或验证错误（如果您做了一些奇怪/错误的事情，这将影响功能）