1

请在这里查看我的 plunkr

https://plnkr.co/edit/QRQQmxf3ZDyh6o0CqtrD?p=preview

我有一个下拉列表,如下所示:

<form name="frmAccount" role="form" ng-submit="submit()">

    <div class="row">
                        <div class="col-md-6 col-md-offset-3">
                            <div class="form-group">
                                <label for="defaultProvider">My Default Provider</label>
                                <select class="form-control"  ng-model="frmData.defaultProvider">
                                    <option ng-selected="{{row.Selected}}" ng-repeat="row in providerlist" value="{{row}}" name="defaultProvider" >{{row.Text}} </option>
                                </select>
                            </div>
                        </div>
                    </div>

    <div class="col-md-6 col-md-offset-3">
        <button class="btn btn-group-lg btn-primary pull-right" type="submit" >Submit</button>
    </div>
    </form>

在我的控制器中,我有一个提交功能,如下所示:

 $scope.submit= function(){
    $scope.selectedValue = $scope.frmData.defaultProvider;
  }

当我在下拉列表中选择不同的值后单击提交按钮时,我可以看到 selectedvalue,但如果我不选择不同的值,则 ng-model="frmData.defaultProvider" 不会获得初始值价值。

加载页面时,如何让“frmData.defaultProvider”与默认值绑定?

4

4 回答 4

0

$scope.filterCondition = {
        operator: 'neq'
    }

    $scope.operators = [{
        value: 'eq',
        displayName: 'equals'
    }, {
        value: 'neq',
        displayName: 'not equal'
    }]
    
    $scope.myButtonFunction=function (){
    $scope.value = $scope.filterCondition.operator;
}
<div>Operator is: {{filterCondition.operator}}</div>
    <div class="row">
        <select ng-model="filterCondition.operator">
            <option ng-selected="{{operator.value == filterCondition.operator}}"
                    ng-repeat="operator in operators" 
                    value="{{operator.value}}">{{operator.displayName}}</option>
        </select>
</div>
<div class="row">
   <button ng-click="myButtonFunction()">
         myButton
   </button>
</div>
<div class="row">
    value:{{value}}
</div>

你可以试试。

于 2016-04-15T08:24:05.397 回答
0

使用此代码您可以轻松解决您的问题...

var app = angular.module('app', ['ngRoute']);


app.controller('DefaultController', ['$scope', function($scope){
  $scope.welcome = "Hello";  
 $scope.frmData={defaultProvider:''};
$scope.providerlist = [{
	"Selected": false,
	"Text": "Test1",
	"Value": "9"
}, {
	"Selected": true,
	"Text": "Test2",
	"Value": "8"
}];
 $scope.frmData.defaultProvider = $scope.providerlist[1];
  $scope.submit= function(){
    $scope.selectedValue = $scope.frmData.defaultProvider;
  }
  
  
 
  
}]);
<!DOCTYPE html>
<html ng-app="app">
  <head>
    <link data-require="bootstrap-css@3.3.6" data-semver="3.3.6" rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.css" />
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.3/angular.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.3/angular-route.js"></script>
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
  </head>

  <body ng-controller="DefaultController">
    <h1>{{welcome}}</h1>
    {{preferencesMenu}}
    
    <form name="frmAccount" role="form" ng-submit="submit()">
   
    <div class="row">
                        <div class="col-md-6 col-md-offset-3">
                            <div class="form-group">
                                <label for="defaultProvider">My Default Provider</label>
                                <select class="form-control"  data-ng-model="frmData.defaultProvider">
                                    <option ng-selected="{{row.Selected}}" ng-repeat="row in providerlist" value="{{row}}" name="defaultProvider" >{{row.Text}} </option>
                                </select>
                            </div>
                        </div>
                    </div>
    
    <div class="col-md-6 col-md-offset-3">
        <button class="btn btn-group-lg btn-primary pull-right" type="submit" >Submit</button>
    </div>
    </form>
    
    <div>
      Value Selected: {{frmData.defaultProvider}}
    </div>
  </body>
</html>

于 2016-04-15T06:57:43.940 回答
0

在控制器中初始化模型:

$scope.providerlist = ...
$scope.frmData = {defaultProvider: $scope.providerlist[1]};
于 2016-04-15T06:44:56.580 回答
0

您可以使用 ng-init 来初始化 $scope.frmData.defaultProvider 的值,如下所示,

<select class="form-control"  ng-model="frmData.defaultProvider" ng-init="frmData.defaultProvider = providerlist[1]">
                                <option ng-selected="{{row.Selected}}" ng-repeat="row in providerlist" value="{{row}}" name="defaultProvider" >{{row.Text}} </option>
                            </select>
于 2016-04-15T07:04:49.680 回答