Элементы блочного уровня в дисплее: встроенный блок

В ваших component.ts,

Вы можете получить доступ к значениям элементов управления формы, определенных в вашей Реактивной форме, используя что-то вроде этого:

console.log(this.staffs.value)

Для случая доступа значения каждого элемента в FormArray, вы можете сделать это:

console.log(this.staffs['controls']['staffs']['controls'].value)

или

console.log(this.staffsFA.value)

Аналогично, в вашем component.html вы можете получить доступ к отдельным значениям Form Control, используя интерполяция шаблона:

   <ng-container *ngFor="let sdr of staffsFA.controls; let i=index;">
    <div class="row" [formGroupName]="i">
      <label>{{ sdr.value.staffName }}</label>
      <input type='text' formControlName="staffRate">
    </div>
  </ng-container>
13
задан Faraz Kelhini 24 November 2011 в 07:32
поделиться

2 ответа

Хорошо дисплей: встроенный блок может быть немного хитрым для получения перекрестного браузера. Это потребует в минимуме, нескольких взломах и, для Firefox 2, потенциально дополнительный элемент.

CSS

.inlineBlock { display: -moz-inline-stack; display: inline-block; zoom: 1; *display: inline; }

дисплей:-moz-inline-stack для Firefox 2. У всех непосредственных детей должен будет быть дисплей: блок или иначе быть элементами блочного уровня. Отметьте, нужен ли Вам Ваш элемент встроенного блока для упаковывания, я думаю, что можно использовать дисплей:-moz-inline-box вместо этого.

масштабирование: 1 дает hasLayout элементу (для IE 7 и ниже). Часть 1 взлома необходима для IE7 и ниже совместимости.

** дисплей: встроенный* взлом вторая часть взлома, необходимого для IE7 и ниже совместимости.

Я иногда должен добавлять переполнение: скрытый для совместимости IE также.

Для Вашей определенной ситуации я думаю, в чем Вы нуждаетесь:

<html><head><style type="text/css">
#left {
  display: inline-block;
  background: red;
  width: 20%;
  height: 100%;
  vertical-align: top;
}
#right {
  display: inline-block;
  background: green;
  width: 80%;
  height: 100%;
  vertical-align: top;
}
</style></head><body>
  <div id="left">Left</div><div id="right"><p>Right</p><p>Right 2</p></div>
</body></html>
7
ответ дан 2 December 2019 в 01:21
поделиться

Я получаю плохое форматирование.

Вы кусаетесь граничным сворачиванием, CSS 'ум', который является болью так же часто, как это - благо. Поле <p> выходит из строя за пределы для становления верхним полем на встроенном блоке; это затем ведет себя, поскольку поле было бы на 'встроенном' элементе быть, выставляя выравнивание по вертикали текстовой строки.

Можно остановить его происходящий путем удаления полей из ‘p’ элементов и использования дополняющий вместо этого. Кроме того, поместите непустой элемент без верхнего поля наверху блока и один без нижнего поля внизу.

Это ошибка Firefox

Я думаю возможно да, согласно спецификации:

Поля элементов встроенного блока не выходят из строя (даже со своими детьми притока).

3
ответ дан 2 December 2019 в 01:21
поделиться