angular 的 select 中 ng-options 设置默认值

omgdog 发布于2019-08-20 12:29 / 2972人阅读

摘要：的中设置默认值在开发的后台系统中，经常需要对后台数据进行修改，而在修改数据的过程中，若页面中有下拉框，需要让其选中原来的数据，即中需要设置默认值。默认值设置方法在中使用绑定数据，在对应的中定义全局数据，并为其赋值，该值即为的默认值。

angular 的 select 中 ng-options 设置默认值

在AngularJS 开发的后台web系统中，经常需要对后台数据进行修改，而在修改数据的过程中，若页面中有select下拉框，需要让其选中原来的数据，即select中需要设置默认值。

默认值设置方法：

在select中使用ng-model绑定数据myColor，

在对应的controller中定义ng-model全局数据$scope.myColor，并为其赋值，该值即为select的默认值。

代码如下：

angular.module("myApp", [])
  .controller("MyController", ["$scope"], function($scope) {
    $scope.colors = ["black", "white", "red", "blue", "yellow"];
    
    $scope.myColor = $scope.colors[2];
  })

显示效果：

说明：该文档参考angular官方api

云服务器 GPU云服务器 select默认值 input设置默认值 js函数设置默认值 js框中如何默认值

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/81008.html

angular.js ng-options的正确打开姿势

摘要：直接上代码商品其中后面的为的值，用于显示选项名称。请求失败执行代码直接上代码商品: 其中 track by 后面的为option的value值， g.name用于显示选项名称。 var app = angular.module(myApp, []); app.controller(goodsCt...

Profeel 2019-08-21 18:34 评论0 收藏0
AngularJS: 使用ng-option生成下拉框并在controller调用

摘要：写的时候碰到很多问题，因为刚开始用，写法思路还是和写相似，导致与在一个生成下拉框时花费了个小时才最终搞定。不自觉的用自己所熟悉的方式思考问题，付出了惨重的代价实在是不能对jquery的ajax方法和基于页面dom的各种取值、传值方法满意（虽然jquery已经解救过我一次了），刚好手上这个项目用jquery的方法写了一半，决定试试很久以前自学的angularJS，把现在项目中jquer...

huaixiaoz 2019-08-19 14:38 评论0 收藏0
angularjs初识

摘要：总的来说，收获很大。这里这里就以一些常用的标签谈谈中的基础知识。然后还有一个表示记录的索引号，从开始。已经用这个数组的值替他们分好了组了，是不是感觉很强大，还有很多强大的地方等着我们去学习，掌握它，还有更强大的等着我们。周三的时候跟着老师简单的入门了angularjs，然后去图书馆找了一本《Angularjs实战》来看了看，虽然这本书网上的评价不太高，但对于初学者的我来说还是不错的，...

tanglijun 2019-08-23 11:49 评论0 收藏0
AngularJS简述

流行框架简介 angularjs是一款非常优秀的前端高级JS框架，由谷歌团队开发维护，能够快速构建单页web应用，化繁为简无论是angularjs还是jQuery都是用原生JS封装的库：对代码进行封装，调用封装的方法，简化操作传统方式是用get方式获取元素，然后点方法 jQuery库实现了对获取方式的封装，对方法的封装框架：提供代码书写规则，按照规则去写代码，框架会帮我们实现响应的功能...

Jason 2019-08-23 11:25 评论0 收藏0
Angular实现的网上商城SKU组合查询组件

摘要：最近学习了，正好又完整的做了一个电商网站，就利用实现了一个组合查询组件，首先介绍是个什么东西。库存量单位，即库存进出计量的单位，可以是以件盒托盘等为单位。在服装鞋类商品中使用最多最普遍。最近学习了angular，正好又完整的做了一个电商网站，就利用angular实现了一个sku组合查询组件，首先介绍sku是个什么东西。sku=stock keeping unit(库存量单位)，sku...

mcterry 2019-08-21 10:42 评论0 收藏0