垂直堆叠 md-chips Angularjs

2024-01-03

我正在 AngularJS 中测试 md-chips 指令。

有没有办法垂直堆叠“芯片”而不是水平附加芯片?

我一直在尝试这里找到的演示:

https://material.angularjs.org/latest/demo/chips https://material.angularjs.org/latest/demo/chips


以下 CSS 样式是使芯片能够垂直堆叠所需的最低限度:

md-chip {
  clear: left;
}

md-chip 的默认 CSS 是float: left并申请clear: left导致切屑相互清除并垂直堆叠。正在申请float: none或其他一些更改浮动的样式似乎很容易破坏默认指令,并导致无法访问输入字段并添加新芯片。我注意到可能需要应用一些其他样式来修复.md-chips包含芯片的容器,例如限制其宽度以获得所需的结果。

See: Codepen 上的垂直堆叠芯片演示 https://codepen.io/airbridge/pen/bqEMzV

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

垂直堆叠 md-chips Angularjs 的相关文章

随机推荐

  • JSF 在执行 ajax 更新时重置字段

    我在 JSF 页面上遇到问题 我在第一个账单名字字段中输入了一个名称 如果我点击复制帐单地址复选框 这会停止渲染递送地址面板并通过 ajax 隐藏它 我刚刚在第一个字段中输入的值将重置为之前的状态 JSF Page
  • 如何根据多个条件对行求和 - R? [复制]

    这个问题在这里已经有答案了 我有一个数据框 其中包含绘图 ID plotID 树种代码 species 和覆盖值 cover 您可以看到其中一张图中有多个树种记录 如果每个图中存在重复的 物种 行 如何对 覆盖 字段求和 例如 以下是一些示
  • 如何在 Dreamweaver cs5 中调试 php 代码?

    如果它不支持调试 是否有任何扩展或插件 Dreamweaver 即使支持 PHP 源代码的语法高亮显示 也并不完全被称为 PHP 开发环境 所以我不确定它是否支持 PHP 代码的调试 相反 我建议您使用另一个更面向 PHP 的 IDE 例如
  • 警告:字符串文字中转义的非标准使用

    我有查询删除双空格并将其转换为单空格 UPDATE tablename SET name trim regexp replace name s s g 它给出错误 WARNING nonstandard use of escape in a
  • 如何将字符串解析为哈希表

    是否有一种简单 甚至可能是单个命令 的方法可以从包含键值对的字符串构建哈希表 关联数组 JSON 等等 并用给定的分隔符分隔 Example n1 v1 n2 v2 n3 v3 where 是分隔符 应该返回 n1 v1 n2 v2 n3
  • VB6 项目可以使用 .Net .dll

    我有一个VB6项目 我的问题是我可以调用具有项目所有业务规则 来自 VB6 应用程序 的 NET dll 吗 基本上我有一个 VB6 项目 其中有一个调用 vb6 ActiveX dll 的经典 ASP 项目 要求是找出升级应用程序的最佳方
  • MS Word:选择表格单元格内的文本

    我需要在 Word 文档表格的单元格内选择文本 例如 两个字符 下面的代码 Sub testTable For Each itable In ActiveDocument Tables itable Cell 1 2 Range Selec
  • 无法使用 pandas to_sql() 方法将数据插入 Snowflake 数据库表

    我有一个数据库SFOPT TEST在我的雪花实例上 数据库有两种模式AUDITS and PARAMS 架构AUDITS有一个使用 SQLAlchemy 创建的表declarative base class AccountUsageLogi
  • 如何使用 python pandas 读取 json 文件?

    我想使用 python pandas 读取 json 文件 文件的每一行都是一个完整的 JSON 对象 我在下面使用versions 蟒蛇 2 7 6 熊猫 1 19 1 json 文件 id 111 p id 55 name aaa no
  • 播放服务 7.5.0 后无法在 Manifest 中使用 android:icon="@mipmap/ic_launcher"

    我最近使用依赖项更新了播放服务 compile com google android gms play services 7 5 0 我的应用程序图标启动器位于 mipmap ic launcher 但这显示错误AndroidManifes
  • INRIA 是否会向 OCaml 添加并发原语? [关闭]

    Closed 这个问题是基于意见的 help closed questions 目前不接受答案 我所说的 并发 是指像 Erlang 的 actor 和并发 GC 这样的轻量级进程 旨在使此类进程顺利工作 如果 INRIA 摆脱当前 OCa
  • 枚举案例处理 - 使用开关还是字典更好?

    根据具体情况处理枚举的值时 使用 switch 语句还是字典更好 我认为字典会更快 就空间而言 它占用了一些内存 但是 case 语句也会占用一些内存 只是程序本身所需的内存 所以最重要的是 我认为使用字典总是更好 以下是并排比较的两个实现
  • 如何在reactjs的render方法中使用三元运算符?

    我想使用三元运算符根据某些状态条件渲染两个按钮 以避免代码重复 我想做什么 我有两个基于状态值的按钮 取消 和 开始 load cancel 如果单击 取消 按钮load cancel set to true什么时候load cancel
  • 如果在外部单击则隐藏/切换

    我在这里使用这个模板 http startbootstrap com templates simple sidebar html http startbootstrap com templates simple sidebar html 为
  • 如何在 Android 中安排通知

    我正在尝试在将来的某个时间设置通知 我有创建通知的代码 但找不到安排通知的选项 我如何安排通知 不适用于奥利奥 编辑 上面的答案都很好 但不考虑用户重启设备的可能性 这会清除 AlarmManager 安排的 PendingIntent 您
  • Gradle - 仅在目录中的代码发生更改时才执行任务

    我有一个创建 100MB JAR 的 Gradle 任务 现在我只想将它创建为我的一部分gradle build如果项目内的代码已更改 例如特定的 src目录 所以目前 build gradle kts 看起来像 tasks shadowJ
  • 未收到数据时向 Node.js 流添加“静默帧”

    我正在使用 Node js 创建一个 Discord js 机器人 该机器人在语音通道中记录用户的音频 它加入一个频道并开始分别收听每个用户的声音 它记录到 pcm 文件 因此只有原始数据 现在 这可行了 但 Discord 音频流的性质导
  • CSS 像素可以是分数吗?

    可以CSS吗px是分数吗 标准允许吗 如果是这样 主要浏览器是否支持它 伙计们 让我们用文档来支持答案 是的 您可以指定分数像素 由于从第一个版本开始这就是 CSS 的一部分 因此任何支持 CSS 的浏览器都应该很好地支持它 参考 CSS
  • Azure blob 到 Azure SQL 数据库:无法批量加载,因为无法打开文件“xxxx.csv”。操作系统错误代码5(访问被拒绝。)

    我正在尝试在 azure sql 数据库中批量加载 azure blob 存储中的一些数据 文件内容为 customer age gender C1093826151 4 M C352968107 2 M C2054744914 4 F 该
  • 垂直堆叠 md-chips Angularjs

    我正在 AngularJS 中测试 md chips 指令 有没有办法垂直堆叠 芯片 而不是水平附加芯片 我一直在尝试这里找到的演示 https material angularjs org latest demo chips https