javascript - 将数据从 ng-Dialog html 传递到 Controller

Question

在使用 ng-Dialog 时遇到一些问题。 当我注意到 ngDialog Controller 选项时，它起作用了。 我可以从

获取 $scope.descriptionText 值

<p>Description:</p>
    <textarea ng-model="descriptionText"></textarea>

现在我调用没有参数 Controller 的对话框

 ngDialog.open({
          template: 'views/pages/timesheet/template/newEventTemplate.html',
          //controller:'newEventDialogCtrl',
          scope: $scope,
    ...

并且此值 $scope.descriptionText 未定义。

请帮助我将 html 元素的值返回到我的 Controller 或 Controller 范围。

对话调用代码:

    $scope.createNewEventModalWindow = function(args)
    {
      $scope.setNewEventField('start', args.start.value);
      $scope.setNewEventField('end', args.end.value);
      ngDialog.open({
          template: 'views/pages/timesheet/template/newEventTemplate.html',
          //controller:'newEventDialogCtrl',
          scope: $scope,
          className: 'ngdialog-theme-default',
          plain: false,
          showClose: true,
          closeByDocument: true,
          closeByEscape: true,
          appendTo: false,
          disableAnimation: false,
          overlay: false
      }).closePromise.then(function(value)
            {
              console.log('Test msg');
              console.log(value);

              var newEvent = {
                start: $scope.getNewEventField('start'),
                end: $scope.getNewEventField('end'),
                text: $scope.descriptionText,
                userID: getCurrentUserID(),
                projectID: $scope.selectedProject,
                taskID: $scope.selectedTask
              };

              console.log('Event data to server');
              console.log(newEvent);
/*
              TimesheetFactory.createEvent(newEvent)
                .success(function(data) {
                    $scope.events = data;
                    $scope.message('Event created');
                    console.log($scope.events);
                })
                .error(function(data) {
                    console.log('Error: ' + data);
                });
*/
            });
    }

对话框的 HTML 模板:

<div class="ngdialog-message">
    <h3>Create Event</h3>
    <p>Project</p>

    <select id='selectProject' ng-model= "selectedProject">
      <option ng-repeat="project in projects" value="{{project.id}}">{{project.name}}</option>
    </select>
    <p>Task</p>
    <select id='selectTask' ng-model="selectedTask">
      <option ng-repeat="task in tasks" value="{{task.id}}">{{task.name}}</option>
    </select>
    <p>Time</p>

    <input type="time" id="eventTime" name="input" ng-model="timeLentgh"/>

    <p>Description:</p>
    <textarea ng-model="descriptionText"></textarea>
</div>
<div class="ngdialog-buttons">
    <button
      type="button"
      class="ngdialog-button ngdialog-button-secondary"
      ng-click="closeThisDialog()"
    >Cancel</button>
    <button
      type="button"
      class="ngdialog-button ngdialog-button-primary"
      ng-click="btnCreateEventClicked()"
    >Create</button>
</div>

Answer 1

您可以通过这种方式访问​​对话框的范围:

value.$dialog.scope()

value - 您从 closePromise 获得的参数。

例如，在此副本中，您将拥有 descriptionText。

Plunker 检查和播放:http://plnkr.co/edit/nTNwAxyL1KGuvKGAeTmy?p=preview