为什么这不起作用? (例如,为什么脚本不实际运行并创建付款按钮,就像它不在指令中一样。)
.directive('stripeForm', ['$log', function($log) {
return function(scope, elem, attrs) {
var markup = '<form action="/charge" method="POST">\
<script\
src="https://checkout.stripe.com/checkout.js" class="stripe-button"\
data-key="xxx"\
data-image="/square-image.png"\
data-name="Demo Site"\
data-description="2 widgets ($20.00)"\
data-amount="2000">\
</script>\
</form>';
elem.append(angular.element(markup));
};
}]);
下面的 plunkr 演示了这个问题与“data-key”或“data-image”或“data-*”完全无关。如果它是指令,它根本不起作用。无论出于何种原因,如果以这种方式将 script 标签注入(inject)到 DOM 中,则 script 标签实际上不会获取 checkout.js 并运行脚本。
http://plnkr.co/edit/GZC0XlqVM2b1J3ozpHJA?p=preview
我唯一的问题是为什么?
最佳答案
看看这个 plunker :
var form = document.createElement("form");;
form.action = "charge";
form.method = "POST";
var script = document.createElement("script");
script.src = "https://checkout.stripe.com/checkout.js";
script.className = "stripe-button";
script.setAttribute("data-key", "pk_test_6pRNASCoBOKtIshFeQd4XMUh");
script.setAttribute("data-image", "square-image.png");
script.setAttribute("data-name", "Demo Site");
script.setAttribute("data-description", "2 widgets ($20.00)");
script.setAttribute("data-amount", "2000");
form.appendChild(script);
elem.append(angular.element(form));
我所做的是将元素手动创建为 native 对象。也许问题是用 angular.element() 转换给定的 html 标记
希望对你有帮助
关于javascript - 条纹 Angular 形式在指令中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25736411/