angularjs - 布局对齐 ="center"不工作 Angular

Question

我正在尝试使用 layout-align 属性将卡片中的输入/编辑文本居中对齐。然而，由于我的无知和婴儿期(今天开始学习)，我无法弄清楚为什么编辑文本不会在这张卡片 View 中居中对齐。

<div flex="50" layout="row" layout-align="center">
    <md-card flex="50">
        <md-input-container layout-align="center center" class="md-block" flex="50">
            <input required type="text" placeholder="Observation Number" ng-model="learningCenter.observations.obsNum" />
        </md-input-container>
    </md-card>
</div>

演示在这里 :https://codepen.io/camden-kid/pen/zBQZLW?editors=1010#0

Answer 1

根据 Material 指南，您需要将输入容器放置在行元素中，

<md-card flex="50">
    <div layout="row" layout-align="center center">
        <md-input-container  flex="50">
            <input required type="text" placeholder="Observation Number" ng-model="learningCenter.observations.obsNum" />
        </md-input-container>
    </div>
</md-card>

DEMO