angular js中的外部文件

Question

我有一個Angular應用程序。 我在應用程序中創建了一個可以正常運行的組合框。 我可以從我的依存列表中選擇-> DependedQuestions。

<div class="dependedQuestion customizedSelect">
     <select class="T14" ng-model="selectedQuestion.selectedDependedQuestion" ng-options="question.number for question in dependedQuestions"></select>
</div>

我創建了一個名為popup.js的外部文件。 在這個文件中，我要求jQuery UI的對話框。

功能 ：

function dialogWithTwoButtonsComboboxAndTextbox(message,title,callbackOnOK, callbackOnCancel){

var htmlString = "<div id=\"modalConfirm\" title=\""+title+"\">" +
                    "<div class=\"questionnaireAttributesBlockDialog\">" +
                        "<div class=\"questionInformation\">" +
                            "<div class=\"dependencyInstruction questionnaireLabels bold oronCondMFMediumA\"> dependencies</div>" +
                                    "<div class=\"chooseDependedQuestion\">"+
                                        "<div class=\"dependencyQuestionLabel marginLeft1 oronCondMFMediumA fontSize16Px\">שאלה:</div>"+
                                        "<div class=\"dependedQuestion customizedSelect\">"+
                                            "<select class=\"dependedQuestionCombobox fontSize16 oronCondMFMediumA T14\" name=\"typeValidation\" ng-model=\"selectedQuestion.selectedDependedQuestion\" ng-options=\"question.number for question in dependedQuestions\" ng-blur=\"createDependencyOnlyIfTextboxFilled()\"></select>" +
                                        "</div>" +
                                    "<div class=\"chooseDependedQuestion\">"+
                                        "<div class=\"dependencyQuestionLabel  oronCondMFMediumA fontSize16Px\">answer</div>"+
                                        "<input type=\"text\" id=\"optionalValuesForAnswer\" ng-model=\"selectedQuestion.optionalValuesForDependedQuestion\"/>" +
                                    "</div>" +
                                "</div>" +
                            "</div>" +
                        "</div>" +
                    "</div>" +
                "</div>"; 

    defineDialogPopUp(htmlString, message,title, callbackOnOK, callbackOnCancel);
}

函數defineDialogPopUp：

 function defineDialogPopUp(htmlString,message,title, callbackOnOK, callbackOnCancel){
    var dialogButtons = {};
    var approveButtonText = messageToUser.dialogOkButton;
    var cancelButtonText = messageToUser.dialogCancelButton;
    dialogButtons[cancelButtonText] =   { text: cancelButtonText,
                                            class:'btnCancel btnDialog',
                                            click:function() {
                                                if (callbackOnCancel != null)
                                                    callbackOnCancel();
                                                $(this).dialog( "destroy" );
                                            }
                                        }

    dialogButtons[approveButtonText] =  {   text: approveButtonText,
                                            class:'btnApprove btnDialog',
                                            click:function() {
                                                callbackOnOK();
                                                $(this).dialog("destroy");
                                            }
                                    };
    $(htmlString).dialog({
        height: 300,
        width: 500,
        modal: true,
        resizable: false,
        buttons:dialogButtons
    });
}

問題是它顯示了，但是組合框不起作用。 我認為是因為它不成角度嗎？ 我該怎么辦？ 我提醒您，我需要向用戶打開一個對話框。

Answer 1

嘗試使用Angular UI而不是jquery Ui。 http://angular-ui.github.io/