问题标签 [angular-flex-layout]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
angular - 具有弹性布局的 Angular Material 2 卡相互重叠
我正在尝试使用 flex-layout 让 Angular Material 2 卡工作，以便在调整浏览器大小时我正在呈现更改的列数。我正在尝试实现类似于Google Keep的工作方式。
不过，运行这个 plunker，你可以看到当需要包装一系列 Angular Material 卡片时，它们会重叠一点。
有谁知道我需要用 flex-layout 做什么才能让下一行在项目之间有一些边距？它们具有该fxLayoutGap属性，但这似乎仅适用于紧邻内容的对象之间的排水沟，而不适用于下方或上方。
angular - 将 div 与 flex-layout 居中对齐
我目前有一个看起来像这样的组件：
产生这个：
我追求的外观是这样的：
我通过应用样式类将上述文本居中放置在页面上：
添加一个 CSS 类似乎有点太多了，我应该能够使用 flex-layout将其居中div并设置flex为all。50%我只是不太确定我哪里出错了。
css - 在 Angular 中使用 Angular Material / Flex-Layout 创建具有固定标题、固定侧边栏、固定内容部分的布局
我正在使用Angular w/ Angular Material和Flex 布局
我正在尝试为与此站点完全相同的 Web 应用程序创建布局。注意固定的标题，固定的侧边栏，固定的内容痛苦。不使用浏览器滚动，只有 div 滚动并且完全适合浏览器视口。
这是我用来给我基本结构的html：
另外我设置了以下样式：
我注意到，如果没有页面上的工具栏，一切都会完美运行。然后我添加了一个 padding-bottom: 64px; 到 md-sidenav-container、.main-content 类。似乎它为内容修复了它，但不是sidenav。sidenav 滚动条仍然位于浏览器窗口下方。
如果有人能告诉我如何使用 flex 指令，我确实在我的 Angular 应用程序中安装了 flex-layout。否则，纯 CSS 也可以。
angular - angular/flex-layout beta8 得到 TypeError: _this._renderer.setStyle is not a function
代码在@angular/flex-layout@2.0.0-beta.7 上运行良好
刚刚升级到@angular/flex-layout@2.0.0-beta.8 得到了这个错误。
如果我忽略它，那么控制台会抛出第二个错误说
其他模块的版本：
- @angular/core@4.0.3
- @angular/materail@2.0.0-beta.2
怎么了？我应该如何解决这个问题？
angular - Angular 从另一个指令添加 fxFlex 指令
我正在尝试通过另一个自定义指令添加所有 fxFlex fxFlex.gt-xs 指令，以便我可以保持我的 html 尽可能干净。我创建了以下指令
并使用它如下
但在检查 dom 时，它并没有添加和扩展功能。如果我以这种方式使用它，那么它无论如何都可以正常工作
这是一个正确的方法还是我错过了什么？
angular - 动画角度弹性布局拉伸
当它改变它的高度/宽度时，是否可以为 flex-layout 拉伸设置动画？例如，如果我*ngFor在其中一个弹性框中有一个并且我添加了新项目，或者如果我*ngIf在其中一个框中有一个，例如这两个示例：
当用户点击addItem()按钮时，一个新项目被添加到*ngFor循环中的项目中，两个fxFlex元素都会增长，但没有任何动画，所以它看起来很不稳定。
或类似的东西，使用*ngIf：
在这里，因为第一个框只有一个输入字段，所以当isLoaded属性从 false 变为 true 时它会被拉伸，同样没有动画，所以它只是捕捉到它的新高度。
使用时是否可以为这些更改设置动画@angular/flex-layout？
angularjs - 打字稿错误 - 在 Angular 2 中安装 flex-layout 后
我使用"npm install @angular/flex-layout".
安装后，我收到此打字稿错误消息。
“node_modules/@angular/core/index”没有导出的成员“Renderer2”。”“node_modules/@angular/core/index”没有导出的成员“InjectionToken”。
我正在使用Angular Core: 2.4.10版本和
Node: 7.5.0 version.
截图：
material-design - 如何在角度 2 的网格中使用 flex 布局和 md-card？
我正在使用“@angular/core”：“2.4.10”和“@angular/material”：“2.0.0-beta.2”。我已经使用 npm 安装了 flex-layout。我想用卡片设计响应式网格。我正在使用 md-grid-list 和 md-card。如何在 md-card 或 md-grid-list 中使用 flex 布局。网格和卡片应根据窗口/屏幕大小做出响应。预期结果：一旦我减小屏幕尺寸，列数应该减少，当屏幕尺寸大时，列数应该增加而不重叠卡片中的内容。
angular-material - Angular v2.x 支持哪个版本的 flex-layout？
我正在使用 Angular v2.4.10。我想为 Angular v2 安装 flex-layout。但是@angular/flex-layout 的最新版本（2.0.0-beta.8）将需要 Angular v4.x，并且不会与来自此链接的 Angular v2.x 兼容https://github.com/angular/flex -layout-builds/blob/master/CHANGELOG.md。它说来自这个链接https://github.com/angular/flex-layout/wiki的Angular（v2.4.3及更高版本）支持flex-layout。我试图安装以前的beta版本，但它没有，t工作。哪个版本的 flex-layout 与 Angular v2 兼容？
angular - 角路由器插座子不能填充空间
我在用路由器插座填充所有可用空间时遇到问题。
我为我的应用程序使用 angular/flex-layout。并且与路由器一起加载的组件并没有占据所有可用的位置。
路由器插座占用空间而不是子组件。在屏幕截图上，组件是<maat-home></maat-home>. 在 DOM 树中，该组件放置在 router-outlet 之后。
我该怎么做才能使组件<maat-home></maat-home>占用剩余空间？
谢谢！