-
app-preview-button组件 - 云消息服务 KooMessage
background-color: initial !important; } } JavaScript // 引入PreviewService，用来触发事件 import { PreviewService } ； 父主题： 子组件代码示例
-
app-preview-text组件 - 云消息服务 KooMessage
cursor: pointer; } } JavaScript // 引入PreviewService，用来触发事件 import { PreviewService } ; 父主题： 子组件代码示例
-
编写app-preview组件的JavaScript逻辑 - 云消息服务 KooMessage
编写app-preview组件的JavaScript逻辑 您可通过编写app-preview组件的重要js逻辑来设置原模板在预览界面的缩放比例、大小和位置，相关参数及用途如表1所示。 表1 js逻辑参数及用途 参数名 用途 outerWidth 控制模板在预览视图中的缩放尺寸。 pages[0]
-
app-preview-ticketImage组件 - 云消息服务 KooMessage
app-preview-ticketImage组件 HTML <div [style]="item.style" class="ticketImage"> <div class="ticketImage_List"> <div // ngFor为循环指令 *ngFor="let
-
app-preview-card-vouchers组件 - 云消息服务 KooMessage
app-preview-card-vouchers组件 HTML <div [style]="item.style" class="cardVouchers"> // innerHTML会把代码片段插入到当前节点中 <div class="title" [innerHTML]="item
-
app-preview-moreGoods组件 - 云消息服务 KooMessage
app-preview-moreGoods组件 HTML <div :style="item.style" class="moreGoods"> <div class="title"> // innerHTML会把代码片段插入到当前节点中 <span class="title-name"
-
app-preview-eCommerce组件 - 云消息服务 KooMessage
app-preview-eCommerce组件 HTML <div class="ECommerce"> <swiper [autoplay]="false" [loop]="true" *ngIf="item.content.imageList.visibility === 'visible'">
-
事件处理效果预览 - 云消息服务 KooMessage
“事件”是指用户在客户端查看智能短信时，通过与子组件交互可完成的客户端操作。比如手机用户点击短信中的“进入官网”按钮，即可访问官网。 如您需要在预览模板时查询模板绑定的事件处理效果，这一需求可通过调用PreviewService函数统一处理事件来实现。目前item元素支持表1中列举的12种事件类型，您可根据实际情况给组件赋予事件类型。
-
app-preview-image组件 - 云消息服务 KooMessage
app-preview-image组件 HTML <div class="imgBox preview-element"> <img class="preview-element" [src]="item?.src" [style]="item.style" // 若图片的动作类
-
app-preview-card-voucher组件 - 云消息服务 KooMessage
app-preview-card-voucher组件 HTML <div class="card-voucher"> <div class="content"> <div class="content_top"> <div *ngIf="item.content.voucheType
-
app-preview-video组件 - 云消息服务 KooMessage
app-preview-video组件 HTML <div> <video class="preview-element" [poster]="item.cover" controls [style]="item.style" [src]="item.src"></video> </div>
-
app-preview-sideslip组件 - 云消息服务 KooMessage
app-preview-sideslip组件 HTML <div class="Sideslip" [style]="item.style"> <div class="Sideslip-scroll" [style]="{ width: sideslipList.length *
-
app-preview-swiper组件 - 云消息服务 KooMessage
app-preview-swiper组件 开发横滑组件时可定义的属性及其作用如表1所示，您可根据实际需求进行定义。 表1 横滑组件属性及作用 属性 作用 item.style 样式定义。 item.swiper.autoplay 是否自动轮播。 item.swiper.loop 是否循环。
-
子组件代码示例 - 云消息服务 KooMessage
子组件代码示例 app-preview-text组件 app-preview-button组件 app-preview-image组件 app-preview-video组件 app-preview-sideslip组件 app-preview-swiper组件 app-preview-eCommerce组件
-
父组件代码示例 - 云消息服务 KooMessage
// ngIf为判断指令，true为显示，false为隐藏 // [item]=”item”是将item数据传入对应组件，组件内用item变量接收 <app-preview-text *ngIf="item.type === 'text'"
-
支持的子组件类型 - 云消息服务 KooMessage
支持的子组件类型 以图1为例，该模板的预览视图由image、text、button三个子组件拼接而成。目前KooMessage的智能短信模板已支持11种类型的子组件开发，详见表1。对于各类型子组件，子组件代码示例提供了相应的HTML、CSS、JavaScript代码段供参考，部分
-
子组件开发 - 云消息服务 KooMessage
子组件开发 支持的子组件类型 事件处理效果预览 子组件代码示例
-
父组件开发 - 云消息服务 KooMessage
父组件开发 编写app-preview组件的JavaScript逻辑 父组件代码示例
-
按需计费怎么使用，订购页面没有看到购买入口？ - 云消息服务 KooMessage
按需计费怎么使用，订购页面没有看到购买入口？ 用户在开通KooMessage服务时，默认开通按需计费，不使用则不计费。只要账户资金充足，无需任何操作，可以直接使用。 在按需计费模式下，智能信息是按照智能信息发送成功条数，以及智能信息解析的成功条数自动生成话单进行扣费。无需先购买下单，可以直接使用。
-
总体开发思路 - 云消息服务 KooMessage
获取的每个item对象。具体代码请参见父组件代码示例。 自定义不同类型的子组件。 提供多种类型的子组件，如文本组件、图片组件、按钮组件等，可按需调用。 编写子组件的HTML、CSS、JavaScirpt。 子组件代码示例提供了各类型子组件的HTML、CSS和JavaScript代
检测到您已登录华为云国际站账号，为了您更好的体验，建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
