根据先前的选择显示/隐藏选择中的选项

时间:2019-05-20 20:27:32

标签: angularjs

在收货地址选择字段中列出了多个收货地址。 UPS运送选项在下面的运送者选择字段中列出。还出现了另一种运输方式,即“本地货车运输”。此选项仅应 如果用户在“ Street1”字段中选择的地址包含“ 2200 W Apple Ave”,则会显示。

我已经阅读了AngularJS文档中的几个主题(ng-selected,select,ng-hide,ng-show,select,ng-value-ng-options),但不确定如何进行。我很困惑。任何帮助表示赞赏。

发货地址选择

<div ng-show="shipaddresses" ng-class="{'view-form-select': !currentOrder.ShipAddressID, '': currentOrder.ShipAddressID }">
    <label ng-class="{required: !currentOrder.IsMultipleShip()}"
        ng-show="currentOrder.ShipAddressID || !currentOrder.IsMultipleShip()">
        {{('Shipping' | r) + ' ' + ('Address' | r) | xlat}}
    </label>
     <select class="form-control" name="shippingAddress"
          ng-change="setShipAddressAtOrderLevel()"
          ng-options="address.ID as address.AddressName for address in shipaddresses"
          ng-model="currentOrder.ShipAddressID"
          ng-required="!currentOrder.IsMultipleShip()">
            <option value=""></option>
      </select>
</div>

运送到地址JSON->

 shipaddresses= [
{
"ID":"WHS",
"AddressName":"address1",
"Street1":"1940 W Elm",
"CompanyName":"warehouse"
},
{
"ID":"VAN",
"AddressName":"address2",
"Street1":"2200 W Apple Ave",
"CompanyName":"Main"
},
{
"ID":"CAB",
"AddressName":"address3",
"Street1":"2200 W Apple Ave",
"CompanyName":"CCO"
}
]
}

运输方式选择->

<div ng-show="user.ShipMethod != null && shippers"
     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-pristine ng-valid"
            ng-change="updateShipper()" name="shipMethod"
            ng-model="currentOrder.LineItems[0].ShipperName"
            ng-show="user.ShipMethod.ShipperSelectionType ==  
              'UserDropDown'"
            ng-options="shipper.Name as (shipper.Name) for shipper in shippers"> 
        <!--="" --=""-->
        <option value="" class=""></option>
        <option value="0">LOCAL VAN DELIVERY</option>
        <option value="1">UPS Ground</option>
        <option value="2">UPS 3 Day Select</option>
        <option value="3">UPS 2nd Day Air</option>
        <option value="4">UPS 2nd Day Air AM</option>
        <option value="5">UPS Next Day Air Saver</option>
        <option value="6">UPS Next Day Air</option>
        <option value="7">UPS Next Day Air Early A.M.</option>
    </select>
</div>

0 个答案:

没有答案