Question

我正在制作一个angularjs表格。我想将definition.clazz传递给js函数。在控制器中，我有一个像以下的js函数：

$scope.createData=function(clazz){
// do stuff
}

以下是表格的片段：

<select  class="form-control" id="type" name="type" ng-model="definition.clazz">
    <option value="PrimitiveType" 
            ng-selected="type.type=='PRIMITIVE'">
        PrimitiveType
    </option>
    <option value="EnumerationType"
            ng-selected="type.type=='ENUM'">
        EnumerationType
    </option>
</select> 
<button type="button" 
        class="btn btn-primary"
        ng-click="createData(definition.clazz)">
    Create Data   
</button>

当我点击创建数据按钮时，未设置ng-model。即使我在控制台日志中打印definition.clazz。如何获取select的选择值？感谢。

Answer 1

您是否尝试过使用ng-options？我的猜测是ng-model可能需要选择。

Answer 2

试试这个：

<select class="form-control" 
          id="type" 
          name="type" 
          ng-model="definition.clazz" 
          ng-options="option in ['PrimitiveType','EnumerationType']">  

</select>

Answer 3

@Pracede，这是你想要实现的工作解决方案吗？

ng-model的值显示在控制台中：

 

       var app = angular.module("app", []).controller('appCtrl', ['$scope',
          function($scope) {
            //$scope.type ={type="PRIMITIVE"}; // the tricky part?
            
            $scope.type = {};
            $scope.type.type="";
               
            $scope.createData = function(clazz) {
    if(clazz==undefined)
      {
        console.log("SELECT THE TYPE");
        return;
      }              

if(clazz=='PrimitiveType')
              {
                 $scope.type.type='PRIMITIVE';
                 console.log(clazz +  ' ' + $scope.type.type); 
              }
              else
              {
                $scope.type.type='ENUM';
                console.log(clazz +  ' ' + $scope.type.type);
              }    
    }
      }
    ]);

   

  <!DOCTYPE html>
    <html ng-app="app"> 
    <head>
      <title></title>
    </head>
    
    <body ng-controller="appCtrl"> 
      <select class="form-control" id="type" name="type" ng-model="definition.clazz">
<!--<option value="PrimitiveType" ng-selected="type.type=='PRIMITIVE'">PrimitiveType</option>
    <option value="EnumerationType" ng-selected="type.type=='ENUM'">EnumerationType</option>-->
        <option value="PrimitiveType">PrimitiveType</option>
        <option value="EnumerationType">EnumerationType</option>
      </select>
      <button type="button" class="btn btn-primary" ng-click="createData(definition.clazz)">
        Create Data
      </button>
      <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
    </body>   
    </html>

修改您可以在SO上查看这些类似的问题： How does ng-selected work? Updating model with ng-options and ng-selected

但这是我的理解和解决问题的方法之一。

您可以在选项中更改带有值的类型，并根据控制器功能中的值设置类型。因此，没有必要使用ng-selected（在这种情况下我的观点）。

我希望这一补充能够推动你前进。

如何在选择中获取所选值？

3 个答案: