问题标签 [angular-flex-layout]

我在 angular 4 项目中有一个使用材质 flex 的标记，看起来像这样。

我有一个这样的元素数组：

我想遍历这个数组并在 65% div 中填充所有元素的一半，在 35% div 中填充其余元素。如何*ngFor正确使用指令？现在我有这样的解决方案。但它看起来很可怕而且不可读。

有没有其他解决方案可以做到这一点？我也尝试过使用<template>元素。但我的尝试失败了。请帮帮我！

我正在尝试创建一个类似于下图的联系信息表单，但是我遇到了一些困难：

为此，我提出了以下建议：

上图如下所示：

1. 如何将类似于第一张图片的列表项划分为 3，以便名称出现在左侧，数据出现在中间，下一个箭头图标出现在右侧？
2. 我如何将其放置在屏幕中央而不是左侧？
3. 当我将鼠标悬停在 md-icons 上时，它的背景变为灰色。我将如何保持白色背景而不改变它？
4. 如何增加类似于初始形式的 md-list-item 的高度？

供您参考，这是一个 Angular 4 项目，我使用以下软件包：

更新1：

现在，输出占据屏幕的整个宽度，类似于下面，但我希望它在屏幕顶部中心显示为固定大小的框：

我正在学习 Angular，现在我要制作一个登录表单，类似于使用 Angular2、Angular Material 和 Flex-Layout（全部来自 Angular）的 Gmail 页面。
到目前为止一切都很好，唯一的问题是我不知道如何更改卡，因此在 Gmail 页面上div使用时它会填满整个屏幕。 我怎样才能做到这一点？fxFlex.lt-sm

到目前为止我所做的： https ://plnkr.co/edit/X8Rs7QHaMG9XzB1LTkbR?p=preview

普通卡

没有卡

对于第一行 fxLayout="row" 有效，但不适用于其余 4 行，我希望其余行在第一行渲染时渲染。我正在使用 "@angular/core": "^2.4.3","@angular/flex-layout": "2.0.0-beta.1"，而且 md-select 的高度也与 md-input 不同; 如何使所有字段的高度相同。

我想在两行之间留出空隙，如plunkr所示，但我也想让中间的蓝色单元格在顶行的高度不同。

当我改变一个单元格的高度时，它会改变整行。我更大的一个是class="two"

我有这个html：

这个CSS：

我正在使用 angular material 2 ( material.io )，并且我试图将 md-radio-button 的标签放在收音机本身的上方，如下所示：

单选按钮

文档说您可以轻松地将位置设置为之后或之前。我也在使用 flex-layout (github.com/angular/flex-layout)。

这是我的代码：

如果有人可以帮助我，我将非常感激。谢谢！

我在我的 Angular 4 应用程序中使用https://github.com/SebastianM/angular-google-maps 。

我必须在 CSS 中指定地图高度，像这样，否则地图不会显示：

是否可以<agm-map>填充父容器中的剩余空间？

PS：我更喜欢使用https://github.com/angular/flex-layout的解决方案

如何在 fxLayoutAlign 指令的Flex-Layout中均匀使用空间？从这个示例中，我看不到该选项。我已尝试查看 fxLayoutAlign 的 api 文档，但存在一些问题。

我已经安装了 flex-layout https://github.com/angular/flex-layout/ version ^2.0.0-beta.9。

在我的应用程序中，我导入并添加FlexLayoutModule到imports数组中app.module.ts

当我尝试fxLayout在另一个模块的组件模板中使用该指令时，它没有任何效果。

但是，当我将其添加FlexLayoutModule到定义组件的“其他”模块时，它工作正常。

我错过了什么？

我无法让我的 md 按钮浮动到我的待办事项列表的右侧。我正在使用 angular 4x 和 flexLayout 与 angular material 模块

我的代码如下：