- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我正在尝试在 ionic 框架中制作表格或 GridView 。我能够制作该表格,但它看起来与我需要的不一样,请检查图像中的表格 View 。
这是我的代码。实际上我还有标题“Invoice#”和“account Name”,它们应该变成背景灰色。实际上我看到如果我们在行中使用两列,它占用窗口宽度的 50% 50%。但是当有 3 列列占用 33.33% 宽度但在我的情况下,它们无法占据我做错的地方实际上我正在动态生成列现在它是两个但以后可能是五个。我需要它们占用总宽度相等的空间.是否可以在最后一列中添加“+”?
这是代码
<div class="row">
<div ng-repeat="d in data | filter:{checked: true}">
<div class="col">{{d.label}}</div>
<div class="row" ng-repeat="column in displayData">
<div class="col" ng-repeat="field in column.columns" ng-show="d.fieldNameOrPath==field.fieldNameOrPath">{{field.value}}</div>
</div>
</div>
</div>
最佳答案
这是您的 Plunker 的工作版本。要查看添加和删除的列,请单击标题右侧的齿轮图标。
要使网格布局正确,您不能嵌套重复。这意味着您必须稍微更改 ng-show 才能直接观察数据模型上的检查值。
在最基本的形式中,它看起来像这样:
<div class="row">
<div class="col" ng-repeat="d in data | filter:{checked: true}">{{d.label}}</div>
</div>
<div class="row" ng-repeat="column in displayData | filter: query">
<div class="col" ng-repeat="field in column.columns" ng-show="data[$index].checked && data[$index].fieldNameOrPath===field.fieldNameOrPath">{{field.value}}</div>
</div>
您会注意到 Ionic 会自动处理使网格全宽,并且在正确布局时,它会自动均匀地间隔您的列。那是因为它使用了 flexbox。这也允许您告诉特定的列他们应该使用多少空间。其余的列自然会均匀分布以占据剩余的空间。在演示中,我为齿轮和详细信息按钮添加了一列,并为它们提供了 col-10
类。这将强制这些列占据屏幕宽度的 10%。有关网格在 Ionic 中如何工作的更多信息,请阅读文档 here .
我还注意到您似乎有很多功能,您可以在这些功能中尝试执行一些操作,例如管理检查值的更新方式。别那样做。 这就是 AngularJS 和 ng-model 指令的美妙之处。如果范围内不存在该属性,Angular 会为您创建它,如果它确实存在,它只会更新它。例如,请注意我通过设置 ng-model 使您的搜索工作变得多么简单值并将其传递给过滤器。我不必创建 $scope.query,因为 ngModel 会帮我做。同样,我从您的 Controller 中删除了所有函数和对“已检查”值的引用,并且一切正常,因为 ngModel 会自动将已检查属性添加到数据模型中。
关于css - 如何制作如图所示的表格?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30584536/
我想知道像 img 那样最好的方法是什么。我的意思是 block 对齐从左到右并取行的最大长度。哪个更好,编写一个脚本来指定 block 大小并使其适应容器大小,或者使用 css 网格以某种方式进行。
给定字符串: p\u00e5 \u00e5rsbasis i marts.P\u00e5 \u00e5rsbasis faldt industriproduktionen 0,6 procent (-
有没有什么方法可以使用 IPython 用来显示它的格式和对齐方式,将 DataFrame 作为字符串保存到磁盘? 请注意,我想保存完整的数据框,而不仅仅是它的摘要(即头部和尾部)。 最佳答案 IPy
@RestController @ComponentScan public class FileUploadController { @Autowired Environment en
我在浏览 Linux 源代码时,在 initramfs 的第 400 行遇到了一段不熟悉的代码。 .我知道括号中的名称是 188 枚举中的状态。在我看来,这是一个默认数组设置函数指针(我可能是错的)。
我正在尝试编写一个程序,该程序可以在读取命令行参数后屏蔽它们。我知道它存储在 PEB 中,所以我尝试使用 the answer to "How to get the Process Environme
我正在尝试编写一个程序,该程序可以在读取命令行参数后屏蔽它们。我知道它存储在 PEB 中,所以我尝试使用 the answer to "How to get the Process Environme
最近我安装了 Zshell 而不是 Bash。在此期间,然后我看到我的 $PATH 有 7 英里长,所以我决定尝试稍微清理一下。当我卸载 rvm(通过运行 rvm implode 然后是 rm -rf
这是显示转换后图像的页面 这是我的二进制图像数据 ScreenPic 表的数据 请帮忙...让我知道从数据库中获取图像有什么问题。 将二进制转换为图像逻辑的代码。: namespace OverHR.
我有我的网站,它在谷歌搜索中可见,但我希望它显示在 GridView 中,如谷歌搜索关键字(例如“twitter”)所示。有人可以指导我如何实现这一目标吗? 最佳答案 它叫做 sitelinks .
如何获取变量的字符串表示形式,如 console.log() 输出时所示? 例如, const myFunc = async () => 'my string'; ret = myFunc(); co
这个问题在这里已经有了答案: What does the slash mean in help() output? (3 个回答) 关闭 7 年前。 help(foo)交互返回的签名中,/是什么意思?
使用最新版本的tibble,当设置width = Inf时,宽tibble的输出无法正确显示。 根据我对以前版本的测试,宽标题打印得很好,直到 1.3.0 之后的版本。这就是我希望打印的输出,如下所示
以下(正确)不起作用: package main import ( "os" "time" ) func main() { os.Args[0] = "
我们目前有太多用户试图通过使用文件锁的遗留程序访问单个文件的问题。 我正在尝试编写一个将在服务器上运行并监视此特定文件(平面文件数据库)的 dotnet 程序是否可行。每当客户端尝试访问此文件并且它被
以下(理所当然)不起作用: package main import ( "os" "time" ) func main() { os.Args[0] =
我如何总结 html 跨度中的值。我被卡住了,因为我尝试过的代码没有获取 html 值。 12 13 14 最佳答案 根据您的编辑,
任何人的任何想法 - 当我的 console.log 显示 h2_JSON 是一个对象时,为什么我的 javascript 中的逻辑落入此条件的“ELse”部分?? if (h2_JSON == {}
是否可以以某种方式指定toggle('blind')动画的速度? 我的问题是这样的:我用它来显示动态内容,所以我通常不知道要显示的元素的确切大小。由于动画速度取决于“持续时间”参数和可变的元素大小,因
我正在尝试使用 C 来实现这个合并排序伪代码 我想出了这个 int p = 0, r = SEIZE-1, i, j, k; int q = (p + r)/2; int n1 = q-p+1, n2
我是一名优秀的程序员,十分优秀!