angularjs选择没有ng-options或静态选项

时间:2015-08-11 19:57:22

标签: angularjs angularjs-ng-options

如何在angularjs中使用静态选择。

我想创建一个带有statc值的变更事件的选择模型。

<form ng-controller="mycontroller">
    <select class="form-control"  name='modelid' ng-model="modelid"  ng-change="modelidchange">
        <option value="-1">select </option>       
        <option value='4'>Static text 4</option>
        <option value='1'>Static text 1</option>
        <option value='2'>Static text 2</option>                 
    </select>
</form>

我的控制员:

angular.module('app').controller('chapter',function($scope,$http) {
    console.log('ok')
    $scope.id = modelid
    alert($scope.id)
});

我只想得到de model value,但是这个错误:

Error: ngOptions:iexp
Invalid Expression

我不会使用NG-OPTIONS只是静态选择。

有人能帮助我吗?

2 个答案:

答案 0 :(得分:3)

检查此jsfiddle link,也许会有所帮助

<select ng-model="filterCondition.operator">
    <option ng-selected="{{operator.value == filterCondition.operator}}" ng-repeat="operator in operators" value="{{operator.value}}">{{operator.displayName}}</option>

answer

答案 1 :(得分:1)

首先需要稍微更改一下AngularJS代码......

来自此

angular.module('app').controller('chapter',function($scope,$http){
                   console.log('ok')
    $scope.id = modelid
    alert($scope.id)
});

到此

angular.module('app').controller('chapter',function($scope,$http){
    $scope.id = $scope.modelid;
    alert($scope.id);
});

接下来您的控制器不匹配...... 在HTML中你的控制器是

<form ng-controller="mycontroller">

在Angular中你的控制器是

.controller('chapter'...

所以改变它

<form ng-controller="mycontroller">

到此

<form ng-controller="chapter">

最后但并非最不重要: - )

您需要在控制器中使用ng-change定义要调用的功能...所以将整个代码更改为以下内容...

<强> HTML

<form ng-controller="chapter">
    <select class="form-control"  name='modelid' ng-model="modelid"  ng-change="modelidchange()">
    <option value="-1">select </option>       
    <option value='4'>Static text 4</option>
    <option value='1'>Static text 1</option>
    <option value='2'>Static text 2</option>
</select>

<强>角

angular.module('app').controller('chapter',function($scope,$http){
    $scope.modelidchange = function () {
        $scope.id = $scope.modelid;
        alert($scope.id)
    }
});