当前位置: 首页 > 软件库 > 程序开发 > >

ember-bootstrap-power-select

授权协议 MIT License
开发语言 JavaScript
所属分类 程序开发
软件类型 开源软件
地区 不详
投 递 者 简烨烁
操作系统 跨平台
开源组织
适用人群 未知
 软件概览

ember-bootstrap-power-select

CI

Integrate Ember Power Select into your Ember Bootstrapforms.

Compatibility

  • Ember Power Select v4 or above
  • Ember Bootstrap v4 or above
  • Ember.js v3.16 or above
  • Ember CLI v3.15 or above
  • Node.js v10 or above

Installation

ember install ember-bootstrap-power-select

This will additionally install ember-power-select into your app, and setup itsBootstrap theme, either by importing the appropriate Less or Sass file (if you use one of these preprocessors), or byediting your ember-cli-build.js to include the static theme CSS (if you use plain CSS).

Usage

With this addon installed, you have a new controlType of power-select available. Use the options property toset the array of selectable options:

<BsForm @model={{yourModel}} as |form|>
  <form.element @controlType="power-select" @property="foo" @label="Choose" @options={{options}} />
</BsForm>

If your options array consists of objects, use the optionLabelPath to specify the property that should be used as theoptions label:

<BsForm @model={{yourModel}} as |form|>
  <form.element @controlType="power-select" @property="foo" @label="Choose" @options={{options}} @optionLabelPath="title" />
</BsForm>

If you need more control over how the options label are rendered (e.g. for formatting or internalization) you should use the yielded <control> component in block mode:

<BsForm @model={{yourModel}} as |form|>
  <form.element @controlType="power-select" @property="author" @label="Author" @options={{options}} as |el|>
    <el.control as |option|>
      {{option.name}} (b. {{format-date option.dayOfBirth}})
    </el.control>
  </form.element>
</BsForm>

Power Select Multiple

The power-select-multiple is also supported and works similarly to the power-select implementation.

<BsForm @model={{yourModel}} as |form|>
  <form.element @controlType="power-select-multiple" @property="foo" @label="Choose" @options={{options}} />
</BsForm>

Advanced usage

If you need more control of the power-select configuration, use the yielded control component to get direct accessto the power-select component. The power-select's selected, disabled properties and the onChangeaction are already wired up to the controlling form.element for you. Set any other options as you need:

<BsForm @model={{yourModel}} as |form|>
  <form.element @controlType="power-select" @property="foo" @label="Choose" @options={{options}} as |el|>
    <el.control @searchPlaceholder="Type your name" />
  </form.element>
</BsForm>

Please consult the Ember Power Select documentation for all available options.

Contributing

See the Contributing guide for details.

License

This project is licensed under the MIT License.

 相关资料
  • Ember-Power-Select Ember Power Select is a select component written in Ember with a focus in flexibility and extensibility. It is designed to work well with the way we build Ember apps, so it plays ni

  • ember-power-datepicker This addon it's the last member of the Ember Power Project family and itcombines ember-basic-dropdown and ember-power-calendarinto a single datepicker component that exposes the

  • Ember Power Calendar Customizable Calendar Component for Ember. Disclaimer Version 0.14 of this addon requires Ember 3.11 or greater.Versions below 0.14 would work with Ember 3.0+ (and perhaps 2.12+)

  • ember-bootstrap An ember-cli addon for using Bootstrap 4 und 5 in Ember applications. The addon includes the Bootstrap CSS (or Sass, Less) in your project (can be disabled). On top of that, it provide

  • Powerjson 是由 JSON 改进而成的数据交换格式,它将 JSON 支持了部分 JavaScript 语法,使其更加高效可用,并且解决了许多 JSON 历史遗留下来的问题。 它支持 单引号字符串, 多行字符串, 注释, 运算符, 导入文件, 导入其它 PJSON 文件 等。 Simple Demo { // 字符串 helloText: 'hello world', Mu

  • Power*Architect 是一个数据建模工具,主要用在数据仓库和数据集市的模型设计。 It allows the designer to open multiple concurrent source database connections, create and explore profiles of the source data, discover differences betwe