angularjs--------选择下拉框

2023-10-31

<div class="id" ng-app="myApp" ng-init="names=['llr','lla','coco','ckck']" ng-controller="myCtrl">
        <!-- 两个不同写法的下拉框一起使用,第二个会列出数据,但是不会有输入框 -->
        <!-- 问题:     select下拉框单独使用时没事的,如果两个不同写法一起使用,第二个下拉框是包含option的会列出数据但不会出现输入框 -->
        <!-- 解决:    把包含option的下拉框放到第一位,select放到第二位,就不会出现样式失效问题-->
        <!-- 注意:    ng-repeat 指令是通过数组来循环 HTML 代码来创建下拉列表,但 ng-options 指令更适合创建下拉列表,它有以下优势:
                                使用 ng-options 的选项的一个对象, ng-repeat 是一个字符串。 -->
                                <select>
                                    <!-- 默认值第一个 -->
                                    <option ng-repeat="x in names">{{x}}</option>
                                </select>
                                <select ng-model="selectedSite" ng-options="x for x in names"></select>
                                <!-- []  y是值  x是下标 -->
                                <select  ng-model="selectedName" ng-options="x for (x,y) in names"></select>
                                    <h1>数组选择是:{{selectedName}}</h1>
                                    <select  ng-model="selectApp" ng-options="x for (x,y) in sites"></select>
                                    <h1>对象选择是:{{selectApp}}</h1>
    </div>
    <script>
        var app = angular.module('myApp',[]);
        app.controller('myCtrl',function($scope){
                $scope.sites ={
                    site01 :"llr",
                    site02:'lla',
                    site03:'coco'
                }
        })
    </script>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

angularjs--------选择下拉框 的相关文章

随机推荐

  • XGB原理总结记录

    1 CART树 Classification And Regression Tree CART 是决策树的一种 并且是非常重要的决策树 属于Top Ten Machine Learning Algorithm 顾名思义 CART算法既可以用
  • 二进制数的补码及运算

    本人研究不深 如有错误请不吝赐教 先来个最基本的介绍 参考 https blog csdn net jdq8576 article details 82425265 百度百科 https baike baidu com item 补码 源码
  • 性能测试工具系列(一):性能测试工具对比分析

    目前传统的性能测试工具包括LR Jmeter Locust HttpRunnner 在用这些性能测试工具的时候你有没有遇到很多烦恼 比如高并发的时候需要使用分布式压力机并发虚拟用户 比如各种工具的测试报告各不相同等 比如LoadRunner
  • 【问题记录】防止mimikatz获取到明文密码

    1 打补丁KB2871997 2 禁用Wdigest Auth 3 删除用户凭证 搭靶机的时候想弄个通过哈希传递攻击的机器 但是上传mimikatz之后发现可以直接抓取到明文密码 主要是wdigest和ssp credman这两个位置 1
  • 谷歌 基站定位

    首先要清楚一点的是 每一个基站都能够通过请求http www google com loc json获取到一个经纬度 如果用户能够在短时间内获取到较多的基站信息 比如4个或5个 可以通过这几个基站的经纬度计算出比较准确的用户位置 举个例子
  • Linux内存buffer和cache的区别(转)

    内存使用说明 Free 命令相对于top 提供了更简洁的查看系统内存使用情况 root rac1 free total used free shared buffers cached Mem 1035108100898426124 0 12
  • ERP系统介绍

    ERP简介 企业资源计划或称企业资源规划简称ERP Enterprise Resource Planning 由美国著名管理咨询公司Gartner Group Inc 于1990年提出来的 最初被定义为应用软件 但迅速为全世界商业企业所接受
  • 你说,PC做!实在智能推出行业首个基于大模型的TARS-RPA-Agent产品

    2023年初 火遍全球的ChatGPT揭开AIGC元年大幕 国内外各家科技公司纷纷发布大模型 一时间 百模大战 风起云涌 6月下旬 AI行业准独角兽实在智能 Intelligence Indeed 开启自研垂直大语言模型 塔斯 TARS 内
  • Arduino加速度计射频自动化系统

    该项目旨在设计基于加速度计的实验室自动化系统 该系统分为两部分 1 发送器部分和 2 接收器部分 对于该实验 考虑使用两个负载灯泡和风扇 图1给出了系统框图 物料清单 发送端 接收端 接线 发送端 接收端 原理图 代码 发送端代码 接收端代
  • Halcon 12.0下载

    Halcon 12 0 链接 https pan baidu com s 15JpLWsfzIIhQEU4jE 3AsQ 密码 l0wt
  • 华为OD C++机试面试题 02 字符串反转

    华为OD C 机试面试题 02 字符串反转 题目描述 接受一个只包含小写字母的字符串 然后输出该字符串反转后的字符串 字符串长度不超过1000 输入描述 输入一行 为一个只包含小写字母的字符串 输出描述 输出该字符串反转后的字符串 示例1
  • 整流桥-桥式整流工作原理

    整流桥 有多种方法可以用整流二极管将交流电转换为直流电 包括半波整流 全波整流以及桥式整流等 整流桥 就是将桥式整流的四个二极管封装在一起 只引出四个引脚 四个引脚中 两个直流输出端标有 或 两个交流输入端有 标记 应用整流桥到电路中 主要
  • PyQt(Python+Qt)学习随笔:什么是信号绑定(Unbound and Bound Signals)?

    老猿Python博文目录 专栏 使用PyQt开发图形界面Python应用 老猿Python博客地址 1 概述 信号的绑定是由在类的实例变量中第一次通过类实例的方式 即 self 信号 或 实例名 信号 引用时触发 PyQt5会自动将该实例绑
  • python3-元组常用操作和函数

    元组与列表类似 不同点为 格式不同 元组数据使用 小括号 列表数据使用 方括号 元组中的元素不允许修改 删除等操作 即 改变元组中元素的操作都不被允许 元组只存在一个元素时 需要使用 逗号结尾 否则结果默认为对应元素的类型而不是元组 但是列
  • Protrator自动化测试(针对Angular 应用的自动化测试)

    环境准备工作 1 Protrator 是在NodeJs 环境下运行的 所以第一步是安装NodeJS 2 测试本机是否安装了NodeJs 可以命令行下输入 node v 将会输出NodeJS 的版本号 在Window下没有什么好的命令行工具
  • Weblogic-SSRF漏洞复现

    SSRF漏洞存在于http your ip 7001 uddiexplorer SearchPublicRegistries jsp 我们在brupsuite下测试该漏洞 访问一个可以访问的IP PORT 如http 127 0 0 1 7
  • python接口自动化参数传递_2、Python接口自动化系列之unittest结合ddt的使用

    前面一篇我们已经把unittest的常用用法都已经讲过了 可能很多小伙伴有个疑问 unittest框架怎么做数据驱动呢 这节我们就来学习一下 1 unittest 没有自带数据驱动功能 所以如果使用unittest 同时又想使用数据驱动 那
  • vue 后端数据成功返回 页面不渲染_vue能获取到数据数据却渲染不到页面上,为什么?...

    问题描述 从后台可以拿到数据 并打印在控制台但是就是渲染不到页面 我也不知道是为什么 感觉都正常 问题出现的环境背景及自己尝试过哪些方法 尝试用let this this来代替this但是还是没用并且报出success是undefined的
  • 121-----JS基础-----滚轮事件(鼠标)

    一 代码 很简单
  • angularjs--------选择下拉框

    div class id div