[英]using ng-show on option select angularjs
我想将我的输入字段绑定到我的选择选项。 所以如果选择选项是是,输入字段应该是可见的,如果它是否,输入字段应该是隐藏的。
(function(){
var app = angular.module('spa',[
$rootScope.options = [
{
id: 0,
name: 'No'
},
{
id: 1,
name: 'Yes'
}
]
]);
}());
<form name="newData" class="ng-scope ng-pristine ng-invalid ng-invalid-required" error-popup="newData" novalidate>
<div class="form-group item item-input item-select">
<div class="input-label">
Booking Fee Paid
</div>
<select name="booking" ng-model="user.booking" class="form-control ng-pristine ng-invalid ng-invalid-required" ng-options="option.name for option in options track by option.id" ng-init ="user.booking = options[0]" required>
</select>
</div>
<div class="row" ng-show="user.booking.name == 'Yes'">
<div class="col">
<div class="form-group item item-input">
<input type="text" name="amount" ng-model="user.amount" class="form-control" placeholder="Amount">
</div>
</div>
</div>
</form>
http://plnkr.co/edit/v0NrbTeigo3lm1njRu9A?p=preview
任何帮助表示赞赏
我建议你阅读初学者教程@angularjs.org。
这是一个工作示例,可以满足您的要求:
angular.module('app', []) .controller('Sample', Sample); function Sample() { this.options = [{ id: 0, name: 'No' }, { id: 1, name: 'Yes' }]; this.booking = this.options[0]; }
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div ng-app="app" ng-controller="Sample as vm"> <select name="booking" ng-model="vm.booking" ng-options="option.name for option in vm.options"></select> <pre>{{ vm.booking | json }}</pre> <input type="text" ng-show="vm.booking.name === 'Yes'"/> </div>
第二个参数指定所需的模块而不是实现:
angular.module(name, [requires], [configFn]);
所以你有注入错误。 这是固定代码:
http://plnkr.co/edit/L02U4Cq0HIqeLL1AOcbl
var app = angular.module('spa', []);
app.controller('MyController', function($scope) {
$scope.options = [{
id: 0,
name: 'No'
}, {
id: 1,
name: 'Yes'
}];
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.