如何綁定兩個選擇輸入併爲其中的每一個設置初始值

我在此範圍內有此映射：$scope.graphEventsAndFields。其中的對象看起來像這樣：{'event_name': ['field1', 'field2', ...]}（所以關鍵是一個事件名稱，值是該事件的字段數組。如何綁定兩個選擇輸入併爲其中的每一個設置初始值

我想完成以下操作：有兩個選擇輸入，一個與事件和一個爲該事件的字段。當我改變事件類型時，可用的字段會相應地改變。另外，我希望默認情況下，事件輸入選擇了地圖中的第一個鍵和字段輸入以選擇用於上述事件的第一個字段下面這些輸入，這裏會是一個搜索按鈕必須調用與所選擇的兩個值的功能到現在爲止，我有這樣的代碼：

前端：

<div class="form-horizontal"> 
    <div class="form-group" style="margin-bottom: 5px;"> 
     <label class="control-label col-xs-2" style="font-weight: normal;">Event: </label> 
     <div class="col-xs-10"> 
      <select class="form-control indexDropDown ng-pristine ng-valid pulseControl ng-touched" 
        ng-options="key for (key, value) in graphEventsAndFields" 
        ng-model="selectedEventForSearch" ng-change="uiSelectIndex()"> 
      </select> 
     </div> 
    </div> 

    <div class="form-group"> 
     <label class="control-label col-xs-2" style="font-weight: normal;">Field: </label> 
     <div class="col-xs-10"> 
      <select class="form-control indexDropDown ng-pristine ng-valid pulseControl ng-touched" 
        ng-options="field for field in selectedEventForSearch" 
        ng-model="selectedFieldForSearch" ng-change="uiSelectIndex()"> 
      </select> 
     </div> 
</div> 

<div class="btn btn-primary" ng-click="search(selectedEventForSearch, selectedFieldForSearch)">Search</div>

我看到，對於（鍵，值）迭代，for循環默認跟蹤值。所以，我在控制器代碼是這樣的：

let firstKey = Object.keys($scope.graphEventsAndFields)[0]; 
$scope.selectedEventForSearch = $scope.graphEventsAndFields[firstKey];

然而，這只是選擇的事件輸入和selectedEventForSearch變量是實際上是一個默認值陣列（重點）當搜索函數被調用。如果我嘗試使用"key for (key, value) in graphEventsAndFields track by key"之類的東西，並且我在控制器中設置了$scope.selectedEventForSearch = firstKey，它不起作用，所以沒有選擇默認值。

我錯過了什麼？我應該改變我的對象格式（例如有一個對象數組而不是多個鍵的對象）。我能用這種結構實現我所描述的嗎？（優選地）。謝謝！

來源

2017-09-04 Adi

'firstKey'的價值是什麼？並請刪除這行，並檢查'ng-init =「selectedFieldForSearch = selectedEventForSearch [0]」' –

你是什麼意思什麼是第一個鍵的價值？它是一個字符串。僅用於測試的對象是：{「phishing」：[「cluster_id」，「brands」]，「auth」：[「ec_insert_date」，「origin_ip」]}。 – Adi

我刪除了該行，我忘了它，我認爲它可能工作。 – Adi

最後，我改變了數據集格式爲{eventName: 'evn', fields: [..., ..., ...]}等對象的數組。在前端，將代碼更改爲：

  <div class="form-horizontal"> 
       <div class="form-group" style="margin-bottom: 5px;"> 
        <label class="control-label col-xs-2" style="font-weight: normal;">Event: </label> 
        <div class="col-xs-10"> 
         <select class="form-control indexDropDown ng-pristine ng-valid pulseControl ng-touched" 
           ng-options="obj.eventName for obj in graphEventsAndFields track by obj.eventName" 
           ng-model="selectedEventForSearch" ng-change="uiSelectIndex()"> 
         </select> 
        </div> 
       </div> 

       <div class="form-group"> 
        <label class="control-label col-xs-2" style="font-weight: normal;">Field: </label> 
        <div class="col-xs-10"> 
         <select class="form-control indexDropDown ng-pristine ng-valid pulseControl ng-touched" 
           ng-options="field for field in selectedEventForSearch.fields" 
           ng-model="selectedFieldForSearch" ng-change="uiSelectIndex()"> 
         </select> 
        </div> 
       </div> 
      </div>

和Controller：

$scope.selectedEventForSearch = $scope.graphEventsAndFields[0]; 
$scope.selectedFieldForSearch = $scope.selectedEventForSearch.fields[0];

現在，它的工作原理。

來源

2017-09-04 15:16:32 Adi

如何綁定兩個選擇輸入併爲其中的每一個設置初始值

回答

相關問題