设置按钮/从Salesforce快速列表选项中选择选项

Question

我想要两个菜单，第一个菜单中的选项设置第二个菜单中的选项。这将在Salesforce页面上完成，该页面使用Angular JS，特别是UI- VisualForce模块。类似的控件也为菜单使用了角度按钮类，但我不知道如何使用按钮动态设置选项。

我目前的设计是使用select控件和ng-options。

在controller.js中，我声明了菜单要使用的变量，以及为第二个菜单换出数组值的函数。请注意，$scope.fieldOptions是通过对Salesforce的查询来设置的，以便从快速列表字段中提取选项值。此数组在UI-Grid filter选项中使用，该选项接受类似"[ { value：'1'，label：'male‘}，{ value：'2'，label：'female’}...“的格式。

​

  $scope.editRows = 'all';
  $scope.editField = 'Program';
  $scope.editValue;
  $scope.editOptions = {};


$scope.setEditOptions = function(editField) {
  switch (editField) {
    case "Program" :
      $scope.editOptions = $scope.fieldOptions.Program_Enrolled__c;
      break;
    case "Appl. ASSET" :
      $scope.editOptions = $scope.fieldOptions.Applied_for_ASSET__c;
      break;
    case "4 Year Degree" :
      $scope.editOptions = $scope.fieldOptions.Has_Student_Completed_4_Year_Degree__c;
      break;
  }
}  

​

在VisualForce页面上，我将按钮定义在一个按钮组中，后面紧跟着select控件。

​

        <div class="row" style="margin-bottom:10px;">   
          <div class="col-md-12">
            <div class="btn-group">
              <div class="btn-group" dropdown="true" dropdown-append-to-body="true">
                <button class="btn btn-default dropdown-toggle" dropdown-toggle="true" type="button">
                  {{editRows | capitalize}} Rows <span class="caret"></span>
                </button>
                <ul class="dropdown-menu">
                  <li ng-click="editRows = 'all'"><a href="#">All Rows</a></li>
                  <li ng-click="editRows = 'visible'"><a href="#">Visible Rows Only</a></li>
                  <li ng-click="editRows = 'selected'"><a href="#">Selected Rows Only</a></li>
                </ul>
              </div>
              <div class="btn-group" dropdown="true" dropdown-append-to-body="true">
                <button class="btn btn-default dropdown-toggle" ng-click="setEditOptions(editField)"
                        dropdown-toggle="true" type="button">
                  {{editField | capitalize}} <span class="caret"></span>
                </button>
                <ul class="dropdown-menu">
                  <li ng-click="editField = 'Program'"><a href="#">Program Enrolled</a></li>
                  <li ng-click="editField = 'Appl. ASSET'"><a href="#">Applied for ASSET</a></li>
                  <li ng-click="editField = '4 Year Degree'"><a href="#">4-year degree?</a></li>
                </ul>
              </div>
             <div>
                <select ng-model="editValue" ng-options="option.label for option.value in selectOptions">
                </select>  
             </div> 
                
              </div>
    
              <button id="split-button" type="button" class="btn btn-default" ng-click="massUpdate()">Modify</button>
            </div>
          </div>

​

我在正确的轨道上吗？如果有更简单的方法，或者直接使用按钮菜单的方法，请随时提供建议。否则，问题是我如何使用ng-options吗？

Answer 1

好的，比我想象的要简单。两个打字错误。首先，我用{}而不是[]声明了数组。我在select语句ng-options部分中拼写错误。解决了这个问题，它开始工作了。

如果任何人知道任何技巧，让它与按钮工作，使它可以匹配其他按钮，那将是很棒的。否则，我想为了一致性，我会选择所有的选择。此外，还可以将这些选项捆绑到一个数组中，将主菜单选项作为键，这样我就可以在不使用case语句的情况下进行引用。

​

  $scope.editRows = 'all';
  $scope.editField = 'Program';
  $scope.editValue;
  $scope.editOptions = {};

​