AngularJS - 麻煩設置默認下拉菜單選項

我是AngularJS的新手。現在，我已經應用在電子商務網站上的以下兩個過濾器：AngularJS - 麻煩設置默認下拉菜單選項

      <div ng-show="user.ShipMethod != null && shippers && orderShipAddress.AddressName != 'BIG'" " ng-class="{'view-form-select': !currentOrder.LineItems[0].ShipperName, '': currentOrder.LineItems[0].ShipperName }"> 
           <label ng-class="{required: !currentOrder.IsMultipleShip() && user.ShipMethod != null}" ng-show="currentOrder.LineItems[0].ShipperName || !currentOrder.IsMultipleShip() && user.ShipMethod != null">{{('Shipping' | r) + ' Method' | xlat}}</label> 
           <select class="form-control" ng-change="updateShipper()" name="shipMethod" 
             ng-model="currentOrder.LineItems[0].ShipperName" 
             ng-show="user.ShipMethod.ShipperSelectionType == 'UserDropDown'" 
             ng-options="shipper.Name as (shipper.Name + ' ' + (shipper.ShippingRate.Price | currency | xlat)) for shipper in shippers | filter: { Name: '!Pick-Up at BIG'}" 
             ng-required="!currentOrder.IsMultipleShip() && user.ShipMethod != null" > 

            <option value=""></option> 
           </select> 
           <i class="fa fa-truck"></i> 
          </div> 

          <div ng-show="user.ShipMethod != null && shippers && orderShipAddress.AddressName == 'BIG'" ng-class="{'view-form-select': !currentOrder.LineItems[0].ShipperName, '': currentOrder.LineItems[0].ShipperName }"> 
           <label ng-class="{required: !currentOrder.IsMultipleShip() && user.ShipMethod != null}" ng-show="currentOrder.LineItems[0].ShipperName || !currentOrder.IsMultipleShip() && user.ShipMethod != null">{{('Shipping' | r) + ' Method' | xlat}}</label> 
           <select class="form-control" ng-change="updateShipper()" name="shipMethod" 
             ng-model="currentOrder.LineItems[0].ShipperName" 
             ng-show="user.ShipMethod.ShipperSelectionType == 'UserDropDown'" 
             ng-options="shipper.Name as (shipper.Name + ' ' + (shipper.ShippingRate.Price | currency | xlat)) for shipper in shippers | filter: { Name: 'Pick-Up at BIG'}" 
             ng-required="!currentOrder.IsMultipleShip() && user.ShipMethod != null" > 
            <option value=""></option> 
           </select> 
           <i class="fa fa-truck"></i> 
          </div> 
         </div>

我控制器位於：https://big.four51ordercloud.com/test0530/js/directives/ordershipping.js

在我的控制，我想出了這個設置默認的下拉菜單選項，但我不確定將它放入updateShipper（）函數的位置。如果下拉菜單中只有1個選項，我希望它默認。現在，如果有1個選項，用戶必須手動選擇它，但可以填充其他選項，具體取決於是否滿足其他過濾器的條件。您看到的第一個過濾器總是會在下拉菜單中產生多個選項，而第二個過濾器總是隻會產生一個選項 - 「大量拾取」選項。

$scope.currentOrder.LineItems[0].ShipperName = $scope.shippers[0];

來源

2015-06-13 JD06

問題我也不清楚。你是否想爲列表項目設置默認值？ – Navaneet

對不起;是...列表的默認值。 – JD06

使用ng-model設置列表項的默認值。當你選擇一個項目你已經設置了NG-模型變量將UPADTE

見example

<select ng-options="p for p in animal" 
      ng-model="selectedanimal"></select>

來源

2015-06-13 17:34:13 Navaneet

AngularJS - 麻煩設置默認下拉菜單選項

回答

相關問題