如何使用 ng-option 设置 select 元素的默认值

2024-04-10

我在这里看到了 Angular select 指令的文档:http://docs.angularjs.org/api/ng.directive:select http://docs.angularjs.org/api/ng.directive:select。 我不知道如何设置默认值。这很令人困惑:

选择作为数组中值的标签

这是对象:

{
    "type": "select", 
    "name": "Service",
    "value": "Service 3", 
    "values": [ "Service 1", "Service 2", "Service 3", "Service 4"] 
}

html(工作):

<select><option ng-repeat="value in prop.values">{{value}}</option></select>

然后我尝试在 select 元素内添加一个 ng-option 属性来设置prop.value作为默认选项(不起作用)。

ng-options="(prop.value) for v in prop.values"

我究竟做错了什么?


因此,假设该对象在您的范围内:

<div ng-controller="MyCtrl">
  <select ng-model="prop.value" ng-options="v for v in prop.values">
  </select>
</div>

 

function MyCtrl($scope) {
  $scope.prop = {
    "type": "select", 
    "name": "Service",
    "value": "Service 3", 
    "values": [ "Service 1", "Service 2", "Service 3", "Service 4"] 
  };
}

工作笨蛋:http://plnkr.co/edit/wTRXZYEPrZJRizEltQ2g http://plnkr.co/edit/wTRXZYEPrZJRizEltQ2g

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何使用 ng-option 设置 select 元素的默认值 的相关文章

  • ui-sref 和变量状态参数名称

    我想呈现一个链接 例如 a 其中州名myState和钥匙myKey是变量 有办法做到这一点吗 我发现自己处于同样的情况 我也无法完成这一点 尝试使用 ng click 移动代码 并在 ng click 函数内部使用 stage go htt
  • AngularJs ng-if 比较日期

    我正在比较 ng 中的两个日期 如果这就是我的玉文件的样子 li list group item ng if app Segments 0 StartDate getTime gt date getTime div row div col
  • 使用 SystemJS 和 TypeScript 的 Angular 应用程序中的“意外令牌导出”

    问题 神秘的 意外的代币导出 我碰巧在 plunker 中运行的 Angular 示例中遇到此错误 其中 SystemJS 在浏览器中转换 TypeScript 代码 代码没有任何问题本地运行良好 Solution 这不是角度问题 在浏览器
  • AngularJS工厂如何返回一个对象

    我有一个要求 我应该在其中编写工厂 这个工厂应该包含3个函数init save和delete 我应该从控制器调用 init 函数 该函数返回一个对象 该对象具有执行添加和删除功能的功能 我怎样才能做到这一点 以下是我的代码 它成功执行了 i
  • 使用 AngularJS 制作 Windows Phone 全景图

    我正在尝试在 AngularJS 应用程序中复制 Windows Phone Ui 这是一个example http www expertreviews co uk gallery features 1295629 designing wi
  • Angular-Datatables + Angular-xeditable:取消可编辑行

    当组合 Angular DataTables 和 Angular XEditable 时 添加新行时会取消可编辑行 这是jsfiddle https jsfiddle net faj61h5d 10 示例操作如下 1 这是初始状态 2 将第
  • 页面点击其他路径后 $timeout 继续运行

    我在用yo angular fullstack生成器来构建我的网站 当用户注册该网站时 它将发送一封带有链接的激活电子邮件 当用户点击该链接时 会显示激活成功并超时进入主页 但是 当超时未结束 用户点击页面中的任何其他链接时 会跳转到其他页
  • 如何为 ng-repeat orderBy 创建回调?

    寻找一种方法让 AngularJS 的 ng repeat orderBy 过滤器在完成渲染后执行回调 Markup div table thead tr th Name th th Age th tr thead tbody tr tr
  • 监听指令中的表单提交事件

    我想监听指令中提交的表单 假设我有这样的指令 app directive myDirective function return restrict A require form scope smth link function scope
  • 如何使用 AngularJS、Devise 和 UI Router 全局实现身份验证?

    我对 Angular 很陌生 所以这可能是一个新手问题 我正在尝试实现一个简单的任务管理器 只是一个练习 以 Rails 作为后端 以 Angular 作为前端 到目前为止 我遵循了教程 一切正常 现在我想在全球范围内实施身份验证 这意味着
  • 如何访问Web api控制器中的mvc控制器以从视图中获取pdf

    我为单页 Web 应用程序创建了 Web Api 和 MVC 组合 我想调用 Web api 并渲染 mvc 控制器以使用 Rotativa api 从视图创建 pdf 问题是当我在 Web api 中访问 mvc 控制器时它不起作用 我如
  • 从 url 角度加载模板并在 div 内编译

    由于我是 Angular JS 的新手 我想知道如何加载外部模板并将其与一些数据一起编译到目标中div 例如我有这个模板
  • ChangeState 之后重置/卸载控制器(调用注销)。 AngularJS

    我正在创建一个应用程序 用户可以从 Facebook 或 Twitter 登录 登录后 用户将被定向到某个主页 在这里 控制器加载并调用我的初始函数 该函数加载特定于该用户的数据 当用户单击 注销 时 令牌将被清除 用户将被定向到登录页面
  • 在 AngularJS 中使用单个输入过滤多个字段

    我有一个 JSON 对象 如下所示 id 1 firstName Jennifer middleName null lastName Aniston address New York City id 2 firstName Angelina
  • Angular ui 路由器单元测试(状态到 url)

    我在应用程序中对路由器进行单元测试时遇到一些麻烦 该应用程序是基于 Angular ui 路由器构建的 我想要测试的是状态转换是否适当地更改了 URL 稍后会有更复杂的测试 但这就是我开始的地方 这是我的应用程序代码的相关部分 angula
  • 为什么 Promise `.then` 方法的回调是反模式

    我在 StackOverflow 上看到了答案 人们建议为 AngularJS 服务提供回调函数 app controller tokenCtrl function scope tokenService tokenService getTo
  • 如何将 PHP 与 yeoman Angular 项目集成

    我在用着yeoman questions tagged yeoman项目使用角js questions tagged angularjs通常我知道如何在普通项目中将 angularjs 与 PHP 结合使用 但我很困惑如何将 php 与 y
  • ng-submit 和 ng-click 在 ionic iPhone 应用程序中多次触发

    我正在尝试离子框架 它看起来非常好 但是 我在提交表单时遇到问题 表单触发两次 首先是按下提交按钮时 然后是点击屏幕上的任意位置 这种情况在 xcode 模拟器和我的 iphone 4gs 上都会发生 这就是我所做的 我使用以下命令安装侧菜
  • $http post 未与 asp.net MVC 模型绑定

    为什么 angularjs http post 的有效负载没有绑定到输入模型 当调用该操作时 模型为空 并且 request params 和 request forms 不显示发送表单的任何迹象 但 fiddler 请求显示负载是通过 J
  • 在 Angular SPA 中设置 404 页面的最佳方法?

    我有一个在 Angular 上运行的应用程序 并且我已经有一个 http 拦截设置 我的问题是我的 api 返回了一些我想重定向到 404 页面的 404 错误 还有一些我不想重定向的错误 例如 当导航到新页面时 如果该页面的内容返回 40

随机推荐