将数据从ng-Dialog html传递到控制器

时间:2015-12-01 22:12:58

标签: javascript html angularjs

使用ng-Dialog时遇到一些问题。 当我注意到ngDialog控制器选项时,它可以工作。 我可以从

获得$scope.descriptionText
<p>Description:</p>
    <textarea ng-model="descriptionText"></textarea>

现在我用对话框控制器调用对话框

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

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

请帮我将html元素的值返回给我的控制器或控制器范围。

对话呼叫代码:

    $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>

1 个答案:

答案 0 :(得分:2)

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

value.$dialog.scope()

value - 来自closePromise的参数。

在这种情况下,例如你会descriptionText

要检查和玩游戏:http://plnkr.co/edit/nTNwAxyL1KGuvKGAeTmy?p=preview