Тег шаблона Liquid для компонентов кода

Примечание

Действует с 12 октября 2022 г, в качестве порталов для Power Apps используется Power Pages. Дополнительная информация: Microsoft Power Pages теперь доступен для всех (блог)
Скоро мы мигрируем и объединим документацию порталов Power Apps с документацией Power Pages.

Power Apps component framework позволяет профессиональным разработчикам и создателям приложений создавать компоненты кода для приложений на основе модели и холста. Эти компоненты кода могут обеспечить расширенный опыт для пользователей, работающих с данными в формах, представлениях и на панелях мониторинга. Дополнительные сведения: Использование компонентов кода на порталах

Важно!

Тег шаблона Liquid для компонентов кода требует версию портала 9.3.10.x или новее.

В этом выпуске мы предоставляли возможность добавлять компоненты кода с помощью Тег шаблона Liquid на веб-страницах и реализовали компоненты с помощью веб-API, которые включены для компонентов уровня поля в формах на порталах.

Компоненты кода могут быть добавлены с помощью тега шаблона Liquid codecomponent. Ключ для обозначения компонента кода, который необходимо загрузить, передается с использованием атрибута name. Ключом может быть GUID (который является идентификатором компонента кода) или имя компонента кода, импортированного в Microsoft Dataverse.

Значения свойств, которые ожидает компонент кода, необходимо передать в виде пары ключ/значение, разделенных знаком ":" (знак двоеточия), где ключ — это имя свойства, а значение — строковое значение JSON.

{% codecomponent name: <ID or name> <property1:value> <property2:value> %}

Например, чтобы добавить компонент кода, ожидающий входного параметра с именем controlValue, используйте следующий тег шаблона Liquid:

{% codecomponent name:abc_SampleNamespace.MapControl controlValue:'Space Needle' controlApiKey:<API Key Value>%}

Совет

В этом примере используются параметры, называемые controlvalue и controlApiKey, однако для используемого компонента могут потребоваться другие имена параметров.

Вы можете использовать пример Map Control и упаковать код компонента как решение для использования с порталами.

Примечание

Ресурсы, созданные сообществом, не поддерживаются корпорацией Майкрософт. Если у вас появились проблемы или вопросы, связанные с ресурсами сообщества, обратитесь к издателю ресурса. Перед использованием этих ресурсов вы должны убедиться, что они соответствуют рекомендациям Power Apps component framework, и должны использоваться только в справочных целях.

Учебное пособие: использование компонентов кода на страницах с тегом шаблона Liquid

В этом руководстве вы настроите порталы Power Apps, чтобы добавить компонент на веб-страницу. Затем вы посетите веб-страницу портала и поработаете с компонентом.

Подготовка к работе

Если вы используете пример компонента кода, используемый в этом руководстве, убедитесь, что вы сначала импортируете образцы решений в среду, прежде чем приступить. Чтобы узнать об импорте решения, см. Импорт решений.

Предварительные условия

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

Примечание

В этом руководстве используется образец кода, созданный с использованием Power Apps component framework для демонстрации элемента управления картой на веб-странице. Вы также можете использовать любой существующий или новый собственный компонент или любую другую веб-страницу для этого руководства. В этом случае убедитесь, что вы используете свой компонент и веб-страницу, выполняя шаги, описанные в этом руководстве. Для получения дополнительной информации о том, как создавать компоненты кода, см. Создайте свой первый компонент.

Шаг 1. Добавьте компонент кода на веб-страницу из Studio

1. Откройте свой портал в  студии порталов Power Apps.

2. В верхнем углу слева выберите Создать страницу.

3. Выберите Пустая.

4. На правой панели свойств обновите имя веб-страницы. Например, "Средство просмотра карты".

5. Обновите частичный URL-адрес. Например, "mapviewer".

6. Разверните Разрешения.

7. Отключите Страница доступна всем пользователям.

8. Выберите веб-роли, которым должен быть разрешен доступ к этой странице.

9. Выберите редактируемую область на странице для редактирования исходного кода Liquid.

10. Откройте редактор кода Studio.

11. Добавьте элемент управления с тегом шаблона Liquid, используя следующий синтаксис:

    {% codecomponent name:abc\_SampleNamespace.MapControl controlValue:'Space Needle' controlApiKey:<API Key Value> %}
    

    Совет

    Чтобы получить подробную информацию обо всех импортированных компонентах и найти имя компонента, см. веб-API CustomControl.

    Например:

    • Поиск компонента:

      https://contoso.api.crm10.dynamics.com/api/data/v9.2/customcontrols?$select=ContosoCustomControlName

    • Чтобы получить входные параметры для компонента:

      https://contoso.api.crm10.dynamics.com/api/data/v9.2/customcontrols?$filter=name eq 'ContosoCustomControlName' &$select=manifest

12. Сохраните и закройте редактор кода.

13. В правом верхнем углу выберите Обзор веб-сайта.

14. На веб-странице теперь будет отображаться добавленный на нее элемент управления.

Следующие шаги

Обзор: использование компонентов кода на порталах

См. также

Тег сущности Codecomponent Dataverse
Тег шаблона Codecomponent
Обзор Power Apps component framework
Создание первого компонента
Добавление компонентов кода в столбец или таблицу в приложениях на основе модели
Реализация примера компонента веб-API портала

Примечание

Каковы ваши предпочтения в отношении языка документации? Пройдите краткий опрос (обратите внимание, что этот опрос представлен на английском языке).

Опрос займет около семи минут. Личные данные не собираются (заявление о конфиденциальности).