代码之家  ›  专栏  ›  技术社区  ›  Daniel Ellison

Angularjs材质-同步多个选择框

  •  0
  • Daniel Ellison  · 技术社区  · 6 年前

    我需要让他们都同步起来,这样当用户选择选项1,在wichever框,所有其他框将在选项1。

      $scope.French_Options = ["Un", "Deux", "Trois"];
      $scope.Bilingual_Options = ["Un/One", "Deux/Two", "Trois/Three"];
      $scope.English_Options = ["One", "Two", "Three"];
    
    <md-input-container>
        <label>French</label>
        <md-select ng-model="selection.french" ng-change="baseValueChange()" >
            <md-option ng-repeat="option in French_Options" ng-value="option "> {{état_fr}} </md-option>
        </md-select>
    </md-input-container>                              
    
    <md-input-container>
        <label>Bilingual/ Status</label>
        <md-select ng-model="selection.bilingual" ng-change="Notifications.('Bilingue', $index)" >
            <md-option ng-repeat="option in Bilingual_Options" ng-value="option "> {{état_bilingue}} </md-option>
        </md-select>
    </md-input-container>                                                                         
    
    <md-input-container style="margin-top: 5px; margin-bottom: 5px;" flex="25">
        <label>English</label>
        <md-select ng-model="selection.english" ng-change="baseValueChange()>
            <md-option ng-repeat="option in English_options" ng-value="option "> {{état_en}} </md-option>
        </md-select>
    </md-input-container>   
    

    有人知道如何做到这一点吗?

    1 回复  |  直到 6 年前
        1
  •  1
  •   miqh    6 年前

    您可以在 ng-change 回调以帮助自动设置其他选择。

    • 新选择的选项
    • 它所属的选项集合
    • 所选选项在其所属集合中的位置

    一旦你有了那个位置,你就可以用它来更新所有其他的选项,这样被选中的选项就可以在同一个位置上使用这个选项。

    Here's a quick demonstration of how you might achieve this.