本文整理汇总了TypeScript中noml.ui类的典型用法代码示例。如果您正苦于以下问题：TypeScript ui类的具体用法？TypeScript ui怎么用？TypeScript ui使用的例子？那么, 这里精选的类代码示例或许可以为您提供帮助。
在下文中一共展示了ui类的10个代码示例，这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞，您的评价将有助于系统推荐出更棒的TypeScript代码示例。
示例1: getMenuItem
getMenuItem(box: Mailbox) {
return ui.li()
.class('clickable')
.classIf(this.logic.isMailboxSelected(box.id), 'selected')
.onClick(_ => this.logic.gotoMailbox(box.id))
.child(ui.span(box.messages.length).class('count'), box.name);
}示例2: getBody
getBody(): ui.Element {
let box = this.logic.getSelectedMailbox();
if (!box) {
return ui.span('select a mailbox');
}
return ui.table().class('mailboxClass').child(
tableRowHeader('date', 'subject', 'from', 'to'),
this.getMessageRows(box)
);
}示例3: getBody
getBody() {
const input = ui.input('input').autocomplete(false).ref();
return ui.form(input, ui.button('submit')).onSubmit(() => {
const message = input.getValue();
input.setValue('');
input.focus();
if (message === '') {
return;
}
return this.logic.addEntry({message});
});
}示例4: getBody
getBody() {
const {logic} = this;
return ui.flexDown(
new AddEntry(logic),
ui.flexRight(
new ui.Tristate(logic.getEntries,
() => 'loading',
entries => new EntryList(logic).data(entries),
e => 'failed to load entries'
).refreshOn(logic.entriesChanged),
ui.flexDown(
ui.flexPad(),
ui.button('delete', () => logic.deleteEntry())
)
)
);
}示例5: getBody
getBody() {
const {folders, mailbox, message} = this.logic;
const messagePromise = ui.delayedPromise(message.getSelectedMessage).then(x => {
// throw new Error('failed to load message');
return x;
});
const hasMailbox = !!state.mailbox.selectedId;
const hasMessage = !!state.message.selectedId;
return ui.flexRight(
new Folders(folders, 'folders'),
ui.flexDown().class('mailContainer').child(
new Mailbox(mailbox, 'mailbox'),
new ui.Tristate(() => hasMailbox && hasMessage && messagePromise,
() => 'pending',
m => new MessageUi({getMessage: () => m}, 'message'),
e => ui.span(e.message).class('error')
)
)
);
}示例6:
e => ui.span(e.message).class('error')示例7: trThTd
function trThTd(th: string, td: string) {
return ui.tr(ui.th(th), ui.td(td));
}示例8:
return ui.tr(Array.from(args, a => ui.td(a)));示例9: tableRowData
export function tableRowData(...args): ui.Element {
return ui.tr(Array.from(args, a => ui.td(a)));
}示例10: tableRowHeader
export function tableRowHeader(...args): ui.Element {
return ui.tr(Array.from(args, a => ui.th(a)));
}