Почему элементы шаблона отображаются как "скрытый" в afterRender? - PullRequest
0 голосов
/ 02 июня 2011

Почему шаблоны div отображаются как ": hidden" в afterRender?

Вот код:

<html>
<head>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script> 
  <script src="js/jquery.tmpl.js"></script>
  <script src="js/knockout-1.2.1.debug.js"></script>
  <script>
  $(document).ready(function() {
        m = function (name)
        {
          this.name = name;
        }

        viewModel = {
          a : ko.observableArray(),
          sparkie : function (elements) {
            div = elements[0];
            console.log($(div).is(':hidden'));
          },
        }

        ko.applyBindings(viewModel);

        viewModel.a.push(new m('oh-no'));
    });
    </script>
</head>
<body>

<script type="text/html" id="tpl">
  <div> ${ $data.name } </div>
</script>

<div data-bind='template: { name: "tpl", foreach: a, afterRender: sparkie }'></div>

</body>
</html>

Ответы [ 2 ]

2 голосов
/ 08 июня 2011

afterRender для

пользовательской логики постобработки для элементов DOM, сгенерированных вашими шаблонами

НО, к сожалению, она вызывается после того, как ваш шаблон готов (применяется к DOM), но он пока не вставлен в HTML.

Если вы используете foreach, Knockout будет вызывать ваш обратный вызов afterRender для каждого элемента, добавляемого в ваш наблюдаемый массив

, но также будет вызываться один раз, если вы передаетеданные для шаблона.

KO позволяет вам давать обратные вызовы afterAdd и / или beforeRemove для манипулирования добавленными / удаленными элементами DOM настраиваемым способом

, поэтому они будутбыть вызванным для каждого добавленного / удаленного элемента в массиве observableArray.Когда они вызываются, ваш DOM готов, так что вы больше не будете его скрывать, но эти обратные вызовы вызываются только при изменении базового observableArray.

<div data-bind="template: { name: 'tpl', foreach: a, afterAdd: sparkie }"></div>
2 голосов
/ 02 июня 2011

Когда afterRender вызывается для привязки шаблона в режиме foreach, элементы еще не добавлены в DOM.Некоторая дополнительная обработка выполняется для обеспечения эффективного добавления / удаления узлов.

Однако вместо этого можно использовать обратный вызов afterAdd при использовании опции foreach для выполнения кода после того, как элементы находятся в DOM,

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...