2016-09-07 2 views
0

Я пытаюсь создать композицию, но я не получаю ничего, что ожидал бы. Почти во всех случаях я пробовал аналогичную настройку, я получаю что-то другое, что неверно, поэтому этот GistRun является репрезентативным только в том случае, если он показывает, что по крайней мере «что-то» не так.Aurelia Composition

Я искал высоко и низко для получения дополнительной информации о конкретной функциональности и синтаксисе compose, но я не могу решить проблемы.

В вышеупомянутом GistRun вы можете видеть, что элемент Контейнер не отображается правильно, h1 не отображается и что @containerless игнорируется.

В подобных сценариях у меня был containerless, проигнорированный на элементе compose, в результате чего проигнорировался рендеринг, и у меня было все, что не работало с именованными слотами.

У меня такое чувство, что я делаю что-то неправильно, и я не могу понять, что это такое. Если кто-то знает, что я делаю неправильно, или могу указать на решение, я был бы очень обязан.

ответ

4

Часть причин, по которым вы не работаете, поскольку вы ожидаете, что ваш сущность основана на очень старой версии фреймворка. Я обновил вашу версию до последней версии пакета Aurelia Джереми Даньюу здесь: https://gist.run/?id=1b304bb0c6dc98b23f4a3994acc280e4 В старой версии фреймворка, который вы использовали в своем стиле, все еще использовался элемент content для контентной проекции.

Есть несколько причин, по которым ваш сущность не будет работать (помимо того, что я упомянул выше). Во-первых, элемент compose (и любые пользовательские элементы, которые вы создаете) не являются самозакрывающимися. Это соответствует спецификации Custom Element. Итак, <compose view="test.html" /> не работает. Во-вторых, существует существующая проблема, касающаяся элементов без контейнеров, которые используются с проекцией содержимого. После разговора с командой эта проблема вряд ли будет решена, так как неконкретные пользовательские элементы на самом деле не поддерживаются спецификацией Shadow DOM v1. Если вы удалите атрибут containerless из элемента compose, ваша демонстрация будет работать. Наконец, вы забыли добавить <require from="container"></require> в начало вашего файла app.html. Таким образом, Аурелия не знала, что <ck-container> является обычным элементом Aurelia. Если вы не зарегистрировали глобальный пользовательский элемент (или какой-либо другой ресурс представления), вы ДОЛЖНЫ require использовать его в любом представлении, в котором вы хотите его использовать.

Теперь давайте обсудим использование containerless. Декоратор и атрибут containerless не должны использоваться просто для «очистки» вашего HTML. Они должны использоваться только тогда, когда абсолютно необходим для достижения ваших целей. «Сделать мой HTML довольно» никогда не абсолютно необходимо. Когда вы используете containerless, вы создаете пользовательский элемент, который, вероятно, никогда не будет использоваться в качестве стандартного настраиваемого элемента. Опять же, команда Aurelia препятствует вам использовать элементы без контейнеров, если это необходимо.

Пример уважительной причины для использования containerless является expained в нашей документации здесь: http://aurelia.io/hub.html#/doc/article/aurelia/framework/latest/cheat-sheet/4

+0

Большое спасибо за ваши комментарии. Теперь я лучше понимаю «без контейнеров». Я не использую его для очистки кода, но я динамически добавляю этих детей в flexbox, а элемент 'compose' заставляет меня чувствовать себя некомфортно. О регистрации: Я думал, что зарегистрировал компонент глобально через 'index.html' с помощью. .globalResources ('container');' О самозакрывающемся: * slaps head * Я знал, что это был суд, который я забыл очистить вверх. Еще раз спасибо за ответ, и если я когда-нибудь получу свою идею, я отправлю ее! –

+0

Вы полностью правы на 'globalResources ('container')' вещь. Я удалил это, даже не глядя, когда увидел, что вы используете старую версию фреймворка. Извини за это. –