Question

我正在尝试将角度素材datepicker 与 ng-switch 一起使用，我已经根据无线电选项日期选择器应该加载的单选按钮。但它没有按预期工作。

这就是我的代码的样子。

单选按钮

var arr = [3,4,6,1,3,5,4];

var first = arr.filter((k,i)=> i!== arr.lastIndexOf(k))[0];

console.log(first)

日期选择器

<div class = "row radio">
            <md-radio-group ng-model="data.group1">

              <md-radio-button  class="md-primary fix-width" ng-model="myVar" value="OneWay">One-way</md-radio-button>
              <md-radio-button  class="md-primary fix-width" ng-model="myVar" value="RoundTrip">Round Trip </md-radio-button>
              <md-radio-button  class="md-primary fix-width" ng-model="myVar" value="MultyWay">Multi-Way + Hotal</md-radio-button>

            </md-radio-group>
        </div>

当我点击一个方向它应该显示单个日期选择器，如果我选择往返它应该显示往返块。

希望此功能不需要js？

我可以知道听到了什么问题吗？

Answer 1

ng-model="myVar"需要位于md-radio-group元素 - CodePen

上

另外，如果你在控制台中查看，将md-datepicker放在md-input-container元素中会出错。

标记

<div ng-controller="AppCtrl" ng-cloak="" ng-app="MyApp">
  <div>
    <md-radio-group ng-model="myVar">
      <md-radio-button  class="md-primary fix-width" value="OneWay">One-way</md-radio-button>
      <md-radio-button  class="md-primary fix-width" value="RoundTrip">Round Trip </md-radio-button>
      <md-radio-button  class="md-primary fix-width" value="MultyWay">Multi-Way + Hotal</md-radio-button>
    </md-radio-group>
  </div>

  <div ng-switch="myVar">
    <div ng-switch-default>
      <div layout="column">
        <label>Depart on</label>
        <md-datepicker ng-model="user.submissionDate"></md-datepicker>
      </div>
    </div>
    <div ng-switch-when="RoundTrip">
      <div layout="column">
        <label>Round trip</label>
        <md-datepicker ng-model="user.submissionDate"></md-datepicker>
      </div>
    </div>
    <div ng-switch-when="MultyWay">
      <div layout="column">
        <label>Multi way</label>
        <md-datepicker ng-model="user.submissionReturnDate"></md-datepicker>
      </div>
    </div>
  </div>
</div>

当我尝试将其与ng-switch一起使用时，Angularjs Material Datepicker无效

1 个答案: