在我们的组件HTML中,我们有一个带引用名称的模态。在这个模态中,我们有按钮来关闭模态。
以下是代码:
<div bsModal #confirmModal="bs-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="confirm modal" aria-hidden="true">
<div class="modal-dialog modal-md">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title pull-left">Confirm</h4>
<button type="button" class="close pull-right" aria-label="Close" (click)="confirmModal.hide()">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<span>Are you sure ?</span>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" (click)="confirmModal.hide()">Cancel</button>
<button type="button" class="btn btn-danger" (click)="confirmModal.hide()">Refresh Data</button>
</div>
</div>
</div>
</div>
要关闭它,我们目前要求举例(click)="confirmModal.hide()"
。使用引用名称。
由于我们在里面引用#confirmModal
的div,可能有办法使用(click)="this.hide()"
调用隐藏功能
当然我尝试了这种语法并且它没有按预期工作,因为this
指的是我理解的组件。
作为奖励:你有什么想法我可以在哪里找到关于这个参考语法#reference
的Angular doc的信息来命名我的html的一部分?我在没有完全了解所有可能性的情况下使用它。
答案 0 :(得分:2)
#abc称为class ProductsController < ApplicationController
def index
@products = Product.order(:name)
respond_to do |format|
format.html
format.csv { send_data @products.to_csv }
format.xls { send_data @products.to_xls }
end
end
end
。您可以在此处找到有关此内容的更多信息:https://angular.io/guide/template-syntax#ref-vars