Question

我将一些数据存储在控制器中作为范围变量，并希望将它们分配给脚本标记的属性，该标记在html中实现并用于支付网关。

以下是范围变量：

$scope.selectedPlan = plan;

这里selectedPlan是具有以下值的数据对象数组：

plan_id: 3
plan_name: "Basic"
price: "30"
validity_text: "30 days"

需要访问一些上述值，例如在html文件中实现的脚本标记中的价格。以下是脚本标记的代码：

<script
                src="https://checkout.stripe.com/checkout.js" class="stripe-button"
                data-key="pk_test_ghxvjhdasfwdadsd"
                data-amount="{{selectedPlan.price}}*100"
                data-name="Amazing Test"
                data-description="Amt: $ {{selectedPlan.price}}"
                data-image="http://test.com/assets/Images/globe.png">
              </script>

这里在上面编写的代码中，selectedplan是控制器的范围对象，需要将price属性分配给script标签的data-amount和data-description属性。因为我是angularjs的新手，不知道如何实现它。

请帮助我实现我想要的目标。

Answer 1

如果要为脚本标记动态计算属性，则需要使用ng-attr指令。代码变为：

<script
   src="https://checkout.stripe.com/checkout.js"
   class="stripe-butt"
   data-key="pk_test_4RvHCPGrrtHK9dW0vqO938ge"
   ng-attr-data-amount="{{selectedPlan.price*100}}"
   data-name="Amazing Minds"
   ng-attr-data-description="Amt: $ {{selectedPlan.price}}"
   data-image="http://itutor.staging.broadweb.com.au/assets/Images/itutorglobe.png">
</script>

然而，Angular并不意味着动态修改<script>标记。我自己从未尝试过这个，但我很确定脚本标签只能用初始参数读取一次，即使在angular有时间编译它们之前也是如此。

解决这个问题的一种方法是使用Angular的$compile服务编译该代码，然后再将其附加到DOM。

然而，这可能过于复杂了。你最好手动创建它。以下是如何执行此操作：Dynamically create a script tag

访问angularjs范围变量并将其分配给html中的脚本标记属性

1 个答案: