AngularJS вложенный ng-привязка к элементам


Думаю, что я упускаю что-то простое здесь, но вот моя проблема:

 <h4 ng-bind="example.heading">
  <small ng-bind="example.subheading"></small>
 </h4>

Не работает - если ng-bind заменяет содержимое внутри тега, то должен ли я использовать синтаксис {{}} вместо этого? Вот так,

<h4>{{example.heading}}<small ng-bind="example.subheading"></small></h4>

Мне нравится идея о том, что скобки не вспыхивают на короткое время, поэтому я выбрал ng-bind. Есть ли другой способ обойти это?

2 2

2 ответа:

Чтобы предотвратить мигание скобок, используйте ng-cloak, чтобы скрыть компиляцию Angular:

<body ng-controller="myCtrl" ng-cloak>
    <h4>{{example.heading}}<small ng-bind="example.subheading"></small></h4>
</body>

ng-cloack это решение проблемы.

Не забудьте добавить следующий css, если вы хотите его использовать

[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak {
    display: none !important;
}