angularjs的select使用及默认选中设置

我最近在研究angularjs学习的道路上，那么今天也算个学习笔记吧！

1 ng-model="standardCourse.showHours"代替name

2 ng-selected = "1"代替selected="selected",但问题是select下会多出一个无用的option

3 在数据准备时设置，$scope.standardCourse.showHours= '1';

解决多出的一个无用的option

<label for="_sel_show_hours">是否显示课时数</label>

<select id="sel_show_hours" ng-model="standardCourse.showHours" >

<option value="1" ng-selected = "1">显示</option>

<option value="0">不显示</option>
</select>

radio也是 ng-checked="1",也需要准备数据时设置默认值

准备数据参考

$stateProvider.state('home.standardCourseAdd', {

    url: "/standardCourse/add",

    templateUrl: "/partials/ace/standardCourse/add.html",

    controller: function ($rootScope, $http, $scope, $location, $anchorScroll, $stateParams, $state, $timeout, $compile, Upload) {

      fnPost($scope, $state, $http, {'name': ''}, '/standardCourse/toAdd.do', function (success, data) {

        $scope.standardCourse = data.entity;

        $scope.standardCourse.showHours= '1';
      });

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。

赞 (0)

相关推荐

  • AngularJS入门教程之Select(选择框)详解

    AngularJS Select(选择框) AngularJS 可以使用数组或对象创建一个下拉列表选项. 使用 ng-options 创建选择框 在 AngularJS 中我们可以使用 ng-option 指令来创建一个下拉列表,列表项通过对象和数组循环输出,如下实例: 实例 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="http://a

  • Angularjs实现带查找筛选功能的select下拉框示例代码

    前言 对于select的下拉列表,像国家选择这样的功能,全世界那么多国家,一直拉滚动条多辛苦,眼睛也要盯着找,累!所以为优化用户体验,带查找功能的下拉框是非常非常有必要的.都知道jquery里有这样的插件,但我们用的是Angularjs,更希望用双向绑定,指令的方式优雅地解决这个问题. 分析 我们的目标是在原来的<select ng-options="">标签上新加一个属性 select-search 就能支持查找的功能.如果这个属性没起作用,也不影响原来的select的功

  • angularjs 实现带查找筛选功能的select下拉框实例

    angularjs 实现带查找筛选功能的select下拉框实例

    一.背景 对于select的下拉列表,像国家选择这样的功能,全世界那么多国家,一直拉滚动条多辛苦,眼睛也要盯着找,累!so,为优化用户体验,带查找功能的下拉框是非常非常有必要的.都知道jquery里有这样的插件,但我们用的是Angularjs,更希望用双向绑定,指令的方式优雅地解决这个问题. 分析:    目标 在原来的<select ng-options="">标签上新加一个属性 select-search 就能支持查找的功能.如果这个属性没起作用,也不影响原来的sele

  • AngularJS实现select的ng-options功能示例

    本文实例讲述了AngularJS实现select的ng-options功能.分享给大家供大家参考,具体如下: controller .controller('MainController', function($scope, $http, $ionicModal, $timeout) { var post = {}; $http.get("data/themeData.json") .success(function(response) { $scope.themeData = res

  • AngularJS基础 ng-selected 指令简单示例

    AngularJS ng-selected 指令 AngularJS 实例 获取选中的选项: 点击复选框选择 BMW 选项: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>

  • AngularJS select设置默认值的实现方法

    AngularJS select设置默认值的实现方法

    AngularJS的select设置默认值 在使用Angular时候使用select标签时会遇到绑定数据指定默认显示值可这样实现 <!DOCTYPE html> <html ng-app="noteApp" ng-controller="noteCtrl"> <head> <meta http-equiv="keywords" content="keyword1,keyword2,keyword

  • AngularJS Select(选择框)使用详解

    1.Select概述 AngularJS 中可以使用 ng-option 指令来创建一个下拉列表,列表项通过对象和数组循环输出 <div ng-app="myApp" ng-controller="myCtrl"> <select ng-model="selectedName" ng-options="x for x in names"> </select> </div> <

  • AngularJS service之select下拉菜单效果

    本文实例为大家分享了service之select下拉菜单效果的具体代码,供大家参考,具体内容如下 <!-- $watch:持续监听数据上的变化,更新界面 --> <!DOCTYPE html> <html lang="en" ng-app="myApp" ng-controller="myCtrl"> <head> <meta charset="utf-8"> <

  • angularjs的select使用及默认选中设置

    我最近在研究angularjs学习的道路上,那么今天也算个学习笔记吧! 1 ng-model="standardCourse.showHours"代替name 2 ng-selected = "1"代替selected="selected",但问题是select下会多出一个无用的option 3 在数据准备时设置,$scope.standardCourse.showHours= '1'; 解决多出的一个无用的option <label fo

  • AngularJS select加载数据选中默认值的方法

    问题描述: 在我们开发项目过程中,避免不了会用到select下拉框,那么在angular中如何使用select呢? 解决方案: 可以用ng-options来动态加载option,然后在用ng-model来匹配.代码如下: //html <select ng-model="role_id1" ng-options="o.name for o in list5"></select> //js $scope.list5 = [{"id&q

  • js动态设置select下拉菜单的默认选中项实例

    利用javascript设置select下拉菜单的选中项. 代码实例如下: <!--js动态设置select下拉菜单的默认选中项--> <html> <head> <title>下拉菜单</title> <script type="text/javascript"> window.onload=function(){ var osel=document.getElementById("selID"

  • select标签设置默认选中的选项方法

    方法有两种. 第一种 通过<select>的属性来设置选中项,此方法可以在动态语言如php在后台根据需要控制输出结果. < select id = "sel" > < option value = "1" >1</ option > < option value = "2" selected = "selected" >2</ option > <

  • angularjs 获取默认选中的单选按钮的value方法

    在Html页面中,有三个单选按钮,默认选中的是第二个"重要"这个选项,设置ng-checked="true",把该选项默认选中,可是在提交表单时,却提示$scope.level为undefine状态,明明默认选中了为什么却是undefine呢? 于是,先测试了一把:在Html页面写下下面的代码: <span style="font-size:18px;"><div ng-controller="testCtrl&quo

  • angular select 默认值设置方法

    如下所示: <select ng-model="selected" ng-options="x.id as x.name for x in users"></select> $scope.users = [ {name:'a',id:'1'}, {name:'b',id:'2'}, {name:'c',id:'3'} ]; $scope.selected='2';//id的值,区分类型 $scope.selected=$scope.users

  • Js操作Select大全(取值、设置选中等等)

    jquery操作select(取值,设置选中) 每一次操作select的时候,总是要出来翻一下资料,不如自己总结一下,以后就翻这里了. 比如<select class="selector"></select> 1.设置value为pxx的项选中 $(".selector").val("pxx"); 2.设置text为pxx的项选中 $(".selector").find("option[tex

  • jquery操作select取值赋值与设置选中实例

    本节内容: jquery实现select下拉框的取值与赋值,设置选中的方法大全. 比如<select class="selector"></select> 1.设置value为pxx的项选中 $(".selector").val("pxx"); 2.设置text为pxx的项选中 $(".selector").find("option[text='pxx']").attr("

  • vue select二级联动第二级默认选中第一个option值的实例

    当二级联动比如选择国家的时候,希望选中一个国家的时候后面城市默认选中第一个城市,则给国家的select加一个@change事件就可以了 <div class="inputLine"> <span>所在区域</span> <select name="" v-model="countryName" @change="selectCountry"> <option :value=

  • select获取下拉框的值 下拉框默认选中方法

    本文主要介绍select下拉框的相关方法. 1.通过id获取下拉框的value和文本值 例如: <select class="form-control" id="numbers"> <option value="1">数字1</option> <option value="2" selected>数字2</option> </select> $("

随机推荐