angulajrjs 弹出时间选择器不在输入行内

angulajrjs popup timepicker not inside input row

我正在尝试在模式上编写一个弹出时间选择器。但是,我希望我的按钮放置在输入内部而不是在该输入之后。我怎样才能做到这一点?

谢谢

这里是 plunker:http://embed.plnkr.co/L2Fs6eCrkP1NmnkNo4CG/

我已经编辑了你的 plunker。工作示例是 here。 您的模态正文应如下所示:

  <div class="modal-body" id="modal-body">
      <label>Selected time is: <em>{{selectedDate | date:'mediumTime' }}</em></label>
      <div class="input-group">
        <input type="text" ng-model="selectedDate" class="form-control">
        <span class="input-group-btn" uib-dropdown auto-close="outsideClick">
          <button type="button" class="btn btn-default dropdown-toggle" uib-dropdown-toggle>
            <i class="glyphicon glyphicon-time"></i>
          </button>
          <ul class="dropdown-menu dropdown-menu-right" uib-dropdown-menu>
            <li>
              <span uib-timepicker ng-model="selectedDate" hour-step="1" show-seconds="true" minute-step="1" show-meridian="ismeridian"></span>
            </li>
          </ul>
        </span>
      </div>
  </div>