带角度的可点击引导行

2024-01-14

我有一张桌子,用引导程序设计。该表的内容是使用 Angular.js 填充的。如何使一行可点击,以便它将调用范围内的函数?

以下代码对我不起作用(ng-click 部分):

Table:

    <table class="table table-hover">
        <thead>
            <tr>
                <th>Name</th>
                <th>Status</th>
            </tr>
        </thead>
        <tbody>
            <tr ng-repeat="ingredient in ingredients" ng-click="setSelected({{$index}});">
                <td>{{ ingredient.name }}</td>
                <td>{{ ingredient.status }}</td>
            </tr>
        </tbody>
    </table>

控制器:

$scope.setSelected = function(index) {
    $scope.selected = $scope.ingredients[index];
    console.log($scope.selected);
};

建议及fiddle http://jsfiddle.net/wnvSD/1/:

<tr ng-repeat="ingredient in ingredients" ng-click="setSelected();">
    <td>{{ ingredient.name }}</td>
    <td>{{ ingredient.status }}</td>
</tr>

<script>
var myApp = angular.module('myApp',[]);

function MyCtrl($scope) {

    $scope.ingredients = [
        {'name': 'potato'},
        {'name': 'tomato'}
    ];

    $scope.setSelected = function() {
        $scope.selected = this.ingredient;
        console.log($scope.selected);
    };

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

带角度的可点击引导行 的相关文章

  • 为 HTML5 Django Web 应用程序实现实时通知系统

    我目前正在开发一个由 Django apache 提供服务的 HTML5 Web 应用程序 该应用程序的目标是监视多个设备 所有客户端逻辑都是用 Angular 编写的 所有数据都来自对后端进行的基于 JSON 的类似 REST 的调用 我
  • D3.js折线图溢出边距

    我有 d3 js 折线图 它作为 angular js 应用程序的指令包含在内 动态添加的线和 xAxis 以及缩放线上的边距溢出 我必须在图的顶部为每条加载的线创建 Ox 轴 并具有 Ox 和 Oy 单独的缩放可能性 Oy 缩放工作正常
  • 将行推入使用 ng-repeat 以角度呈现的表格中

    当客户端单击该行时 我想在表中插入额外的行 不应预取数据 因为我预计最多有 30 行 但每行都有关联的数据 在一次获取中获取这些数据是不合理的 到目前为止 我的方法是使用 ng repeat 迭代我的集合并渲染表格 当客户端按下该行时 客户
  • 函数调用后的两组括号

    我正在寻找如何filters http docs angularjs org api ng 24filter在 Angularjs 中工作 我发现我们需要发送 2 组括号 filter number number fractionSize
  • 当我的网页上有一个持续时间计数器时,AngularJS 有什么帮助吗?

    我有一个使用 Angular ui router 的应用程序 当路由器设置为某种状态时 我希望将计时器设置为例如 2 小时 当它设置为另一个状态时 我想让计数器倒计时 我希望在屏幕上显示剩余时间 有谁有关于如何实现此功能的代码示例吗 如果有
  • Bootstrap 手风琴菜单不起作用

    我设计了一个如图所示的手风琴菜单 如果单击菜单 打开的菜单将关闭 这就是手风琴的功能 但在这个设计中 我逐个单击菜单 但前一个没有关闭 如何解决这个问题 提前致谢 jQuery document ready function var acc
  • 多列定义列表[重复]

    这个问题在这里已经有答案了 我有一个 dl 像这样 dl dt Quantity dd dt Size dd dt Rise dd dt Color dd dd dt dd dt dd dt dd dt dl 该列表是通过 php 动态生成
  • 单元测试依赖注入

    我对茉莉花和业力是全新的 我相信我的环境设置正确 并且我能够运行非常基本的单元测试 但是一旦我尝试实例化控制器 我就会收到未知提供程序错误 并且我不确定如何调试它 我需要传入 stateProvider 依赖项吗 我在角种子示例中没有看到这
  • Swagger 生成 javascript-closure-angular-client

    我是 swagger 的新手 我从 swagger 的在线编辑器生成了一个 javascript 闭包角度客户端 它给了我一个 DefaultAPI js 和其他与我的对象定义匹配的 JS 文件 我在 swagger 文档和网上搜索了一种在
  • 以角度选择项目后保持菜单打开

    单击我的菜单后 我的菜单将关闭toggleShare按钮 我怎样才能防止这种情况 我将 angularJS 与 Angular 材料一起使用 这是我的代码
  • Access-Control-Allow-Headers 不允许请求标头字段 Access-Control-Allow-Headers

    我试图通过发布请求将文件发送到我的服务器 但是当它发送时会导致错误 Access Control Allow Headers 不允许请求标头字段 Content Type 所以我用谷歌搜索了错误并添加了标题 http post rootSc
  • 如何销毁角度工厂实例

    一方面 我有几个工厂 每个工厂都控制一个 websocket 另一方面 其中一个工厂应该在客户端登录时启动 因此 if user isLogged injector get NotificationsWebsocket 这就是我动态初始化工
  • 使用 Angular 指令禁用文本选择

    我正在学习 JavaScript 和 AngularJS 我想使用 Angular Directive 禁用文本选择 我有该函数的 JavaScript 代码 function clearSelection if document sele
  • 如何在编译引导程序时修复较少的错误?

    附件是编译时使用的跟踪grunt dist webmaker Anils MacBook Pro bootstrap anil grunt dist Running clean dist clean task Running less co
  • Capybara-webkit 无法处理与 bootstrap glyphicon 的链接

    我有一个链接 link to q span class glyphicon glyphicon trash span html safe feed item data confirm Are you sure toggle tooltip
  • Protractor+AngularJS+Jasmine - 测试按住项目

    AngularJS 和 Protractor 非常新 但我认为到目前为止我正在朝着正确的方向前进 我的网站有一个项目列表 当您单击该项目并按住 X 秒时 它会打开一个模式窗口 我如何在 Protractor Jasmine 中模拟这种行为
  • 使用 JS 在 Angular 中创建删除按钮的确认警报

    我有一个带有删除按钮的表单 我想创建一个单击删除按钮时弹出的确认框 删除按钮当前有效 我在 javascript 中尝试了一些方法 但没有成功 我正在使用角度 这是最好的方法吗 另外 有谁知道这方面的任何例子 我还没有找到任何有效的例子 d
  • Protractor e2e 测试表头和 , 标签

    我正在使用下表 我想测试每个标签 th td 标签 该标签中的文本以及该文本的计数 HTML 片段 table class table table striped tbody tr th b a Patient Id a b th th b
  • AngularJS:Array.prototype.find() 在 Chrome 中不起作用

    我遇到一个问题 我的角度代码可以在 Firefox 中工作 但不能在 Chrome 中工作 浏览器控制台打印如下 TypeError undefined is not a function at setSelectedColor http
  • 如何在 angular-ui 中动态禁用 ui-sortable 指令

    我正在使用 Angular ui 使用 ui sortable 指令进行排序 是否可以根据范围状态动态启用 禁用可排序功能 因此 我需要一个按钮来更改范围属性的状态 并且根据此属性可排序是否应该工作 角度指令支持观察可排序选项何时发生变化

随机推荐

  • Mongoose .find() 方法导致请求挂起

    我定义了这条路线 但对其发出的任何请求都会陷入 待处理 状态并永远运行 当我记录代码时 我看到1其次是4 这意味着 find 方法中的代码永远不会被执行 Calendar routes router get calendars req re
  • Hive UDF 用于选择除某些列之外的所有列

    HiveQL 以及一般的 SQL 中常见的查询构建模式是选择所有列 SELECT 或明确指定的一组列 SELECT A B C SQL 没有内置机制来选择除指定的一组列之外的所有列 有多种机制可以排除某些列 如中所述这个问题 https s
  • Visual Studio 2012 - F12 进入 razor renderpartial 停止工作

    我正在使用 Visual Studio 2012 和 Resharper 7 如果我有一个 cshtml 视图 可以在其中渲染部分视图 我可以将标记放在该部分视图的名称上 然后按 F12 这将带我到部分视图的文件 现在它突然停止工作了 而是
  • 关于星形图案

    我正在尝试打印下面的星形图案 我使用以下逻辑来打印 前半部分代码 int i j for i 1 i lt 3 i for j 1 j lt i j System out print for j i 1 j gt 1 j System ou
  • Google App Engine 中的 PHP header() 重定向

    我尝试在 Google App 引擎实例上进行标头重定向 header HTTP 1 1 301 Moved Permanently header Location http location header Connection close
  • MySQL存储过程,处理多个游标和查询结果

    如何在同一个例程中使用两个游标 如果我删除第二个游标声明并获取循环 则一切正常 该例程用于在我的网络应用程序中添加朋友 它获取当前用户的 id 和我们要添加为好友的好友的电子邮件 然后检查该电子邮件是否具有相应的用户 id 如果不存在好友关
  • 使用 python nmap 模块扫描先前扫描生成的主机

    我一直在直接从 python 命令行使用该模块 尝试弄清楚它是如何工作的 并开始拼凑出我想要编写的脚本将如何工作 我想做的是首先进行简单的主机发现扫描 例如 n sP PE 然后使用 all hosts 函数生成实际端口扫描的主机列表 所以
  • 设置“log4j.properties”文件的绝对路径

    我的网络应用程序使用 apache commons log4j 通常 log4j 需要类路径中的配置文件 但我需要将日志记录配置委托给外部文件 我需要在环境中部署 war 但日志配置 最大大小 位置等 取决于第二个团队 我的类路径中有一个
  • 如何在 WebApi OwinHost 启动中使用 Ninject 引导程序?

    我正在从 IIS WebAPI 迁移到 OwinHost 利用 nuget 软件包的最新预发布版本 我成功地使用了此处的说明 https github com ninject Ninject Web Common wiki Setting
  • 上个月名称的 VBA 代码

    我已在电子邮件中添加了如下文本 请提供 MMMM 月末的数字 其中 MMMM 是上个月的名称 今天是四月 MMMM 将显示三月 我有以下代码 Dim newDate newDate DateAdd M 1 Now 但结果是 27 03 20
  • hadoop 中的 -libjars 问题

    我正在尝试在 Hadoop 上运行 MapReduce 作业 但遇到错误 并且不确定出了什么问题 我必须传递我的映射器所需的库罐子 我正在终端上执行以下命令 hadoop ubuntu usr local hadoop bin hadoop
  • 是否可以使用认知用户池身份调用 Lambda 函数?

    我想使用 Javascript API 调用 Lambda 函数 我希望使用在浏览器上进行身份验证的用户的认知用户池凭据来调用它 目标是 Lambda 函数将具有与 cognito 用户池中的用户相同级别的 S3 访问权限 我怎样才能做到这
  • C11aligned_alloc分配的内存realloc是否保持对齐?

    考虑以下 C11 代码 void ptr aligned alloc 4096 4096 do something with ptr ptr realloc ptr 6000 自从有记忆以来ptr指向有 4096 字节对齐aligned a
  • 使用flask-ask 和 ngrok 进行 Alexa 技能开发

    我正在尝试使用 python 中的flask ask 和 ngrok 开始开发 Alexa 的技能 以下是我的代码 from flask import Flask from flask ask import Ask statement qu
  • 在应用程序内购买正在进行时显示 UIAlertView

    我添加了一个 UIAlertView 其中 UIActivityIndi catior 作为我的应用程序的子视图 此警报视图仅在购买正在进行时显示 我在 StoreObserver 中以这种方式放置了警报视图 void paymentQue
  • pandas 使用 .isin() 检查 nan 不工作

    我有以下 pandas DataframeNaN in it import pandas as pd df pd DataFrame 1 2 3 float nan columns A df A 0 1 1 2 2 3 3 NaN 我也有清
  • 如何通过 facebook iOS SDK 和 Graph API 邀请朋友加入我的应用程序

    我正在编写一个 iPhone 应用程序 我想让用户可以选择邀请朋友通过 Facebook 开始使用我的应用程序 更具体地说 我想呈现一个对话框 让用户选择要邀请的特定朋友 我怎样才能做到这一点 Thanks 很简单 您只需编写以下代码即可实
  • 使用 read(...) 时在换行符处停止

    我需要从通过 UART 连接的 GPS 读取 NMEA 语句 操作系统是Debian 语言必须是C 为此 我使用以下命令打开文件open 并读取一个字符串read 但是 这样我必须指定字符串长度 这会分解句子 相反 我想读到 NMEA 句子
  • 开源词典库[关闭]

    Closed 这个问题不符合堆栈溢出指南 help closed questions 目前不接受答案 我正在寻找尽可能多的口语 英语 法语 德语 的免费词典 基本上我需要检查字典中是否存在字符串 我正在考虑 firefox 或 openof
  • 带角度的可点击引导行

    我有一张桌子 用引导程序设计 该表的内容是使用 Angular js 填充的 如何使一行可点击 以便它将调用范围内的函数 以下代码对我不起作用 ng click 部分 Table table class table table hover