内側が$ mdDialogの場合、md-selectは無視されます

Question

材料設計ダイアログボックス内で材料設計要素を使用する際に問題があります。私はmd-select要素を表示して、ユーザーが要求を拒否する3つの理由から選択できるようにし、その選択内から事前に設定されたオプションを選択する代わりに、ユーザーはmd -dialog textarea。しかし、md-selectとmd-option要素は無視され、md-input-containerが適切に表示されている間は要素内にテキストのみが残ります。

var confirm = $mdDialog.prompt() 
.title('Reason for Declining Trip') 
.htmlContent(
    "<md-dialog aria-label='List dialog'>" + 
    "<md-dialog-content>" + 
    " <md-select ng-model='model' placeholder='Select a reason'>" + 
    " <md-option ng-value='opt'>Scheduling Conflict</md-option>" + 
    " <md-option ng-value='opt'>Personal Conflict</md-option>" + 
    " <md-option ng-value='opt'>Hours of Service Concern</md-option>" + 
    " </md-select>" + 
    "<br>" + 
    " <md-input-container class='md-block'>" + 
    " <label>Other</label>" + 
    " <textarea rows='1' md-select-on-focus></textarea>" + 
    " </md-input-container>" + 
    "</md-dialog-content>" + 
    "</md-dialog>" 
) 
.ariaLabel('Lucky day') 
.targetEvent(ev) 
.ok('Decline the Trip') 
.cancel('Cancel'); 

Answer 1

私の代わりに、変数にプロンプ​​トを保存.show()を呼び出し、直接情報を渡すによってこの問題を解決することができました。また、htmlContent:キーをtemplate:に変更する必要がありました。固定コード：

$mdDialog.show({ 
     controller: AppCtrl, 
     template: "<md-dialog aria-label='List dialog'>" + 
      "<md-dialog-content layout-padding>" + 
      "<h2>Reason for Declining Trip</h2>" + 
      " <md-select ng-model='model' placeholder='Select a reason'>" + 
      " <md-option>Scheduling Conflict</md-option>" + 
      " <md-option>Personal Conflict</md-option>" + 
      " <md-option>Hours of Service Concern</md-option>" + 
      " </md-select>" + 
      "<br>" + 
      " <md-input-container class='md-block'>" + 
      " <label>Other</label>" + 
      " <textarea rows='2' md-select-on-focus></textarea>" + 
      " </md-input-container>" + 
      "</md-dialog-content>" + 
      "</md-dialog>", 
     parent: angular.element(document.body), 
     ariaLabel: 'Lucky day', 
     targetEvent: ev, 
     ok: 'Decline the Trip', 
     cancel: 'Cancel' 
    }).then(function() { 
     $scope.status = 'You decided to decline this trip.'; 
     submit(); 
    }, function() { 

    }); 

Answer 2

<md-dialog aria-label="options dialog"> 
     <md-dialog-content layout-padding> 
      <h2 class="md-title">Choose an option</h2> 
      <md-select ng-model="myModel" placeholder="Pick"> 
      <md-option>1</md-option> 
      <md-option>2</md-option> 
      <md-option>3</md-option> 
      </md-select> 
     </md-dialog-content> 
     <md-dialog-actions> 
      <span flex></span> 
      <md-button ng-click="close()">Okay!</md-button> 
     </md-dialog-actions> 
     </md-dialog> 

DEMO