AngularJS條件ng-option

Question

我有一個可以同時用法語和英語翻譯的應用程序角度。 我正在使用角度轉換來做到這一點。 問題是：我從API接收對象數組，在這些對象中，我有一個屬性bookConditionEn和一個屬性bookConditionFr以及其他類似的id。

在select輸入中，我想根據當前語言顯示bookCondition 。

在控制器中，我可以使用$translate服務獲取當前語言

            vm.getCurrentLanguage = function() {
                return $translate.use();
            }

因此，我想知道是否可以在ng-option中使用條件。

    <select 
      ng-options="bookCondition.BookCondition for bookCondition in bookCtrl.bookConditions"
      ng-model="bookCtrl.bookConditions" 
      name="Condition" class="form-control" 
    ></select>

Answer 1

您可以通過更改創建<select>的方式來使用條件顯示/隱藏選項：

<select ng-options=ng-model="bookCtrl.bookConditions" name="Condition" class="form-control">
    <option 
        ng-repeat="bookCondition.BookCondition for bookCondition in bookCtrl.bookConditions"
        ng-if="vm.getCurrentLanguage==bookCondition.language"
    >
</select>

我不太了解您如何設置JSON，因此我假設您具有一個包含語言（bookCondition.language）的屬性。 您可以將其與vm.getCurrentLanguage返回的用戶當前選擇的語言進行vm.getCurrentLanguage 。 順便說一句，我建議將其從函數更改為只是這樣的變量：

vm.currentLanguage = $translate.use();

這是您有條件地指定選項所需要做的全部工作。

Answer 2

它按您的方式工作

                <select ng-model="bookCtrl.bookCondition" name="Condition" class="form-control">
                    <option ng-if="bookCtrl.getCurrentLanguage() === 'en'" ng-repeat="bookCondition in bookCtrl.bookConditions" value="{{bookCondition}}">{{bookCondition.BookCondition}}</option>
                    <option ng-if="bookCtrl.getCurrentLanguage() === 'fr'" ng-repeat="bookCondition in bookCtrl.bookConditions" value="{{bookCondition}}">{{bookCondition.BookConditionFr}}</option>
                </select>