javascript - Typescript 方法未被調用

我有一個進口/出口功能。

這是我的 cshtml 代碼。

<a href="#" onclick="$('#importPopup').dialog('open');return false;"><img src="import.png" class="btn btn-default btn-xs" title="Importfrom file" data-toggle="tooltip" data-placement="bottom" /></a>

<a href="#" onclick="return false;" ng-click="myViewModel.ExportFile()"><img src="export.png" class="btn btn-default btn-xs" title="Export to file" data-toggle="tooltip" data-placement="bottom" /></a>

<div id="importPopup" title="Import">
    <p><input type="file" id="file_upload" name="file_upload" /></p>
    <p><input type="button" class="_button" value="Import File" ng-click="myViewModel.ImportFile()" /></p>
</div>

現在我的 TypeScript 代碼中有兩個函數。

public ImportFile() {
    // some codes here
}

public ExportFile() {
    // some codes here
}

我這裡的問題是我的 ImportFile 函數沒有被執行。我試著在它們兩個上都放了兩個斷點，ExportFile 可以正常工作，但 ImportFile 卻不行。

我在這裡錯過了什麼？

答案＃1

問題在於 $ ('#importPopup').dialog('open');。這意味著 HTML 是由 Bootstrap 呈現的，並沒有經過 Angular 的 $compile 過程。因此 ng-click 沒有被設定。

修理

使用類似 Angular-BootStrap-Modal 的東西： https://angular-ui.github.io/bootstrap/#/modal