javascript - 如何在angularjs中使用带有输入表单的md对话框？

Question

我对 Material md 对话框有疑问。这是我的应用程序的代码笔(http://codepen.io/anon/pen/EyxyXj)。 当我打开对话框，然后单击“保存”时，我创建了一张卡片。为什么我的输入表格中的数据没有保存在卡中？我认为范围存在一些问题。谁能帮帮我？

.then(function(answer) {
      questList.allsQ.push({
         titolo: questList.titolo ,
         capitolo: questList.capitolo,
         descrizione: questList.descrizione,
         importo: questList.importo,
         data: questList.data
      });
      questList.titolo = '';
      questList.capitolo = '';
      questList.descrizione = '';
      questList.importo = '';
      questList.data = '';
}

“推送”功能有效，但单击保存后所有属性均未定义。 谢谢大家。

Answer 1

如下所示在 html 上更正输入字段的 ng-model

<md-input-container class="md-block" flex-gt-xs="">
    <label>Titolo</label>
    <input ng-model="questList.titolo"  size="30" placeholder="inserisci il titolo">
</md-input-container>

您需要将您在模型中更新的数据传递给 hide() 函数，如下所示。

  .controller('DemoCtrl', function($scope, $mdDialog, $mdMedia) {
    $scope.status = '  ';
    var questList = this;
    questList.allsQ = [];
    questList.openDialog = function($event) {
      $mdDialog.show({
        controller: function ($timeout, $q, $scope, $mdDialog) {
                var quest =this; 
                // you will be returning quest

                $scope.cancel = function($event) {
                $mdDialog.cancel();
                };
                $scope.finish = function($event) {
                $mdDialog.hide();
                };
                $scope.answer = function() {
                //pass quest to hide function.
                $mdDialog.hide(quest);
                };
                },
        controllerAs: 'questList',
        templateUrl: 'dialog.tmpl.html',
        parent: angular.element(document.body),
        targetEvent: $event,
        clickOutsideToClose:true,
         locals: {parent: $scope},
      })
     .then(function(quest) {

      //here quest has data you entered in model
      questList.allsQ.push({
         titolo: quest.titolo ,
         capitolo: quest.capitolo,
         descrizione: quest.descrizione,
         importo: quest.importo,
         data: quest.data
      });
      questList.titolo = '';
      questList.capitolo = '';
      questList.descrizione = '';
      questList.importo = '';
      questList.data = '';
      console.log(questList.allsQ);
      console.log(questList.allsQ.length);
    });
    };
  });