使用 ng-repeat 内使用的 ng-click 更改布尔值

2024-01-20

我使用 ng-repeat 在 div 内的 html 页面上显示一些数据。在 - 的里面div我有一个按钮来隐藏每个内容的内容div单独。这是我的 html 文件的简化版本。

<body ng-app="task" ng-controller="repeat">
    <div ng-repeat='x in array' ng-show="{{ x.show }}">
      <p>{{ x.text }}
      </p>
  <button ng-click="toggle()">Hide</button>
    </div>
</body>

我的 .js 文件中的代码如下

var app = angular.module('task');
app.controller('repeat',function($scope){
    $scope.array = [{
        show: true,
        text:'Sample Text 1'},
      { 
        show: true,
        text:'Sample Text 2'},
      { 
        show: true,
        text:'Sample Text 3'}];

    $scope.toggle = function(){
       $scope.array.show = false ;
      };
})

任何人都可以建议我进行所需的更改,以便单击我的div,该特定 div 被隐藏。

我认为我在调用时引用数组的特定元素时犯了一个错误function toggle()通过 ng-click


将您的元素作为切换函数中的参数。

<button ng-click="toggle(x)">Hide</button>

并在控制器中更改它,如下所示:

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

使用 ng-repeat 内使用的 ng-click 更改布尔值 的相关文章

  • 在 Protractor / Webdriver 中等待页面重定向

    我有一个测试 单击按钮并重定向到用户仪表板 当发生这种情况时 Webdriver 返回 javascript error document unloaded while waiting for result 为了解决这个问题 我插入brow
  • AngularJS 控制器等待响应(或设置回调)

    我有一个带有controllers js 和factories js 的AngularJS 应用程序 我喜欢用控制器中的值 我从工厂获得 做一些事情 我的问题是 当我访问这些值时它们是空的 我怎样才能等待回复 或者在哪里可以添加回调 Fla
  • 当我在控制器中使用 state.go 时,离子滑动菜单不会出现

    大家好 我正在使用 ionic 来构建我的应用程序 并且我放置了幻灯片菜单 问题是当我使用 stage go 更改视图时 此工作正常 但幻灯片菜单失败 那么我该如何解决这个问题 路由器 use strict var app angular
  • 未定义,当从 Selenium 触发时,Chrome 通知中未定义

    我正在致力于自动化一个用 Python 编写的网站 并使用 Angular 其中有很多确认通知 我遇到的问题是 Behat 似乎无法识别这些通知 更不用说允许我与它们交互了 我附上了通知的屏幕截图 以及 Behat 生成的 未定义 未定义
  • 如何正确地将代码从angularjs迁移到reactjs

    我正在尝试将代码从 Angular 迁移到 React 不确定这是否正确 只是需要一些帮助 看看我是否朝着正确的方向前进 我不知道角度 所以我很困惑 文本数据 是否类似于反应中的状态 我是否必须在顶部的状态中声明它 角度代码 scope t
  • 在 Angular 单元测试中应该如何处理运行块?

    我的理解是 当您在 Angular 单元测试中加载模块时 run块被调用 我认为如果你正在测试一个组件 你不会想同时测试run块 因为unit测试应该只是测试一个unit 真的吗 如果是的话有什么办法可以防止run阻止运行 我的研究让我认为
  • $http.get() 与 JSON 数据

    我正在编写一个服务器应用程序 并希望客户端使用正文中的数据来参数化我的 GET 方法 如下所示 http v GET http localhost 3000 url text 123 foo bar GET url HTTP 1 1 Acc
  • 模型不是 AngularJS 中输入的日期对象

    使用 AngularJS 我试图使用输入显示日期type date
  • AngularJS:在部分视图出现之前触发 $viewContentLoaded

    对于部分视图 我想做一些我通常会做的 JavaScript 事情 document ready function 例如将 venet 侦听器绑定到元素 我知道这对于 AngularJS 和加载到 根 视图中的部分视图不起作用 因此 我向控制
  • AngularJS with Grunt - 连接到另一台服务器

    我使用 grunt bower 和 yeoman 创建了一个 AngularJS 应用程序 我猜想 Gruntfile js 在 2014 年 1 月之后发生了变化 不确定 这是我的gruntfile js Generated on 201
  • 角度 ng-repeat 根据条件添加样式

    我在 div 列表上使用 ng repeat 并且在渲染此 div 的 json 中手动添加项目 我需要定位我在 json 中添加的最后一个 div 它会自动在屏幕上渲染 即 couse 光标所在的位置 其余部分保持在相同位置 但没有给出渲
  • AngularJS - RouteProvider 解析调用服务方法

    我创建了一项检查用户登录状态的服务 如果令牌存在 则登录用户 否则重定向到登录页面 最初我通过routeProvider解析调用了这个服务 这一次就可以完美工作 但是由于Angularjs服务是单例的 因此测试不会针对连续调用运行 然后 我
  • 使用 Spring 和 Angular 进行 Html5 路由

    我正在尝试使用 Spring boot 和 Angular 1 5 实现 HTML5 路由 如下本文 https spring io blog 2015 05 13 modularizing the client angular js an
  • 如何使用 htaccess 将所有请求重定向到反应或角度索引?

    我正在使用react router 在react 中创建一个应用程序 早些时候 我对 Angular 做了同样的事情 但在这两种情况下 如果用户为 URL 添加书签并直接加载它 它将显示 404 错误 我们可以在 htaccess 中创建这
  • AngularStrap 工具提示禁用我的自定义指令

    我正在尝试让 bs tooltip AngularStrap 指令与我自己的名为 checkStrength 的自定义指令一起使用 该指令检查密码的强度 单独使用这些指令中的任何一个时 它们都可以正常工作 但不能一起工作 This http
  • Angularjs : $locationProvider.hashPrefix("!") ;

    我想将网址显示为 www test com 因为我正在使用 locationProvider hashPrefix 但它显示网址为 www test com 我想 哈希之前而不是哈希之后 Thanks var app angular mod
  • 带有 ui-router 的 Angular 无限摘要循环

    我最初试图解决的问题是 如果用户未登录 则将用户重定向到登录页面 反之亦然 我用下面的代码做到了这一点 run function rootScope http AppService state rootScope on applicatio
  • Jasmine-jQuery loadFixtures 未定义

    我对整个茉莉花的事情仍然很陌生 在过去的几个小时里我陷入了这个问题 我尝试使用 loadFixture 加载外部夹具文件 我使用 Jasmine 2 0 0 和 Jasmine jQuery 2 0 5 ReferenceError loa
  • window.onbeforeunload 在 Android Chrome 上不会触发 [alt.解决方案?]

    我开发了一个简单的聊天应用程序 我正在使用 window onbeforeunload当有人关闭选项卡 浏览器时 基本上是当用户离开房间时 通知其他用户 这是我的代码 scope onExit function scope chatstat
  • 使用 AngularJS 多部分表单数据将文件上传到 Google Cloud Storage

    我正在尝试使用 AngularJS 中指定的多部分方法将图像文件上传到 Google Cloud Storagehttps cloud google com storage docs json api v1 how tos upload m

随机推荐

  • Win32同步

    我正在尝试编写一个应用程序 基于控制台 其中一个线程从控制台读取信息 另一个线程将相同的信息打印回控制台 我陷入了实现同步逻辑的困境 谁能给我推荐一些样品 john 如果你指的是 c 你可以在这里找到示例 使用临界区对象 http msdn
  • 当我向项目添加文件时,为什么 Visual Studio 会检出 .vspscc 文件?

    如果我将新文件添加到 TFS 源代码控制下的项目 它将检出该项目文件以及该项目文件对应的 vspscc 文件 项目文件本身发生更改 以包含新文件 但 vspscc 文件根本没有更改 何必费力去检查呢 有没有办法禁止它被签出 如果有 我应该吗
  • 来自 Process.MainWindowHandle 的 C# HwndSource

    我试图 挂钩 窗口的消息来检测最小化 最大化 我环顾四周 认为执行此操作的唯一 最佳解决方案是挂钩窗口的消息 并检查 WM WINDOWPOSCHANGED 消息 然后检查其状态 我遇到了问题 System Windows Interop
  • 如何使用 Oracle 和 SQL Server 将 .NET 4.5 C# Entity Framework 6 中的列映射为大写?

    我正在使用 C NET 4 5 和实体框架 http en wikipedia org wiki ADO NET Entity Framework我的项目中有 6 个 它使用 Oracle 和 SQL Server 具体取决于客户端的安装
  • Linq to SQL DataContext Windsor IoC内存泄漏问题

    我有一个 ASP NET MVC 应用程序 它使用 Castler Windsor IoC 根据每个 Web 请求创建 Linq2SQL 数据上下文 由于某些我不完全理解的原因 每次创建新的数据上下文 在每个 Web 请求上 时 都会占用大
  • 为什么“​”被注入到我的 HTML 中?

    编辑 您可以看到问题here http project gauss appspot com 查看源代码 EDIT2 有趣的是not源码中的问题 仅适用于控制台 Firebug 也是如此 我在名为的文件中有以下标记test html h3 T
  • win32 c++ 在没有子类化的情况下检测编辑控件中的“输入”?

    基本上 我想要一个 Enter 来触发一条消息 当编辑控件获得焦点并且用户按下 Enter 时 我可以捕获该消息 网上所有的解决方案似乎都是关于子类化的 但我想知道是否还有其他方法可以解决这个问题 例如 我的按钮有一个标识符 ID BUTT
  • 如何自定义 Google 表格中答案为“是”时连接的标头值的顺序

    我怎样才能修改这个方程谷歌电子表格 https docs google com spreadsheets d 1tHL2IdijLaAD5my7m4a1uaiXNleb6Z1bI7x HPXfAVI edit usp sharing我发现这
  • Jar 签名者和 Apk 签名者有什么区别?

    由于 ApkSigner 在 Android SDK 构建工具的修订版 24 0 3 及更高版本中可用 我有一个问题 ApkSigner 和 JarSigner 之间有什么区别 为什么我们需要 ApkSigner 我可以在命令行中为两个签名
  • Swift:什么是 .swift-version 文件?

    我看到很多项目的根目录中有这个文件 swift 版本 以下是一些示例 https github com hackiftekhar IQKeyboardManager https github com hackiftekhar IQKeybo
  • 如何获取数字形式的单选按钮值

    有没有办法以整数形式获取单选按钮的值 我正在提交一个表单 但我从单选按钮获得的值始终是一个字符串 我尝试了很多解决方案 但没有一个有效 div class form check form check inline div
  • Firebase 数据不显示在 flutter 应用程序中

    我正在尝试在使用 flutter 制作的应用程序中使用 Firebase 显示数据 这一直有效直到几个小时前 之后尽管我的代码没有发生任何变化 它仍然停止工作 我收到以下警告 W DynamiteModule 3174 Local modu
  • jquery mobile url 参数未在浏览器中更新,但使用“data-url”获取正确的参数

    我创建了以下示例来展示我所经历的情况 如果我使用 Page 2a 按钮从第 1 页导航到第 2 页 则 URL 将按预期为 page2 is a 当我单击按钮返回第 1 页 然后导航到第 2b 页时 URL 仍会显示 page2 id a
  • 如何将 Tomcat 的 context.xml 中的属性注入到 Seam 组件中?

    Seam 文档会让您相信 如果您在 web xml 中定义一个属性 或者通过 D 参数 它会找到它并自动在您的 bean 上设置它 因此 如果您有一个名为 gateway 的 bean 带有属性登录和 setter 则可以在 seam pr
  • 人体全身检测:轮廓而不是矩形

    我必须使用 opencv 实现整个人体的轮廓检测 从脚到头 多种姿势 例如举手等 我设法编译并运行我在这里找到的代码https gist github com yoggy 1470956 https gist github com yogg
  • 按返回类型重载

    我在这里读到了一些关于这个主题的问题 这对我来说似乎仍然令人困惑 我刚刚开始学习C 还没有学习模板或运算符重载等 现在有没有简单的方法来重载 class My public int get int char get int 没有模板或奇怪的
  • 预览版无法在 MobileFirst Platform Foundation Server 7.0 上运行

    在 MobileFirst Server Platform Foundation 7 0 上 预览版在控制台中不起作用 在 Eclipse 开发方面 一切运行良好 The error message is the following 这是日
  • Winform 菜单条和隐藏选项卡

    您好 我正在考虑创建一个选项卡控件 该选项卡页将通过菜单条中的点击进行过滤 For ex 我的菜单条采用表格 1 我的选项卡控件采用表格 2 我的选项卡控件由 7 个选项卡组成 我希望一次只显示 1 个选项卡 例如 如果我单击菜单条中的名称
  • ARM 汇编:存储上的自动递增寄存器

    是否可以使用 STR 自动递增寄存器的基地址 Rn 我仔细阅读了文档 但未能找到明确的答案 主要是因为命令语法同时适用于 LDR 和 STR 理论上它应该适用于两者 但我找不到任何 auto 的示例 在商店上递增 加载正常 我编写了一个小程
  • 使用 ng-repeat 内使用的 ng-click 更改布尔值

    我使用 ng repeat 在 div 内的 html 页面上显示一些数据 在 的里面div我有一个按钮来隐藏每个内容的内容div单独 这是我的 html 文件的简化版本 div p x text p div