Vaadin-combo-box: рдЦреЛрдЬрддреЗ рд╕рдордп рдбреБрдкреНрд▓рд┐рдХреЗрдЯ рдЖрдЗрдЯрдо

рдХреЛ рдирд┐рд░реНрдорд┐рдд 27 рдорд╛рд░реНрдЪ 2017  ┬╖  14рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ  ┬╖  рд╕реНрд░реЛрдд: vaadin/vaadin-combo-box

рд╡рд┐рд╡рд░рдг

рдЦреЛрдЬрддреЗ рд╕рдордп рдбреБрдкреНрд▓рд┐рдХреЗрдЯ рдЖрдЗрдЯрдо

рдЕрдкреЗрдХреНрд╖рд┐рдд рдкрд░рд┐рдгрд╛рдо

рдХреЗрд╡рд▓ рдПрдХ рдЖрдЗрдЯрдо рдкреНрд░рджрд░реНрд╢рд┐рдд рдХрд░рдирд╛ рдЪрд╛рд╣рд┐рдП

capture d ecran 2017-03-27 a 00 58 46

рд╡рд╛рд╕реНрддрд╡рд┐рдХ рдкрд░рд┐рдгрд╛рдо

capture d ecran 2017-03-27 a 00 43 54

рдкреНрд░рдЬрдирди рдХреЗ рдЪрд░рдг

  1. рдкреГрд╖реНрда рдореЗрдВ рдПрдХ vaadin-combo-box рддрддреНрд╡ рдбрд╛рд▓реЗрдВ
        <vaadin-combo-box #searchSport no-label-float
        *ngIf="activitiesTypes"
          placeholder="Activit├й"
          [items]="activitiesTypes"
          item-label-path="name"
          item-value-path="$key"
          [value]="activitiesTypeUid"
          (selected-item-changed)="activitiesType=$event.detail.value">
        </vaadin-combo-box>

рд╕рд╛рде

    this.activitiesTypes = [
      {
        $key : 'tennis',
        name: 'tennis'
      },
      {
        $key : 'canoe',
        name: 'canoe'
      }
    ];
  1. рд╡реЗрдм рдмреНрд░рд╛рдЙрдЬрд╝рд░ рдореЗрдВ рдкреЗрдЬ рдЦреЛрд▓реЗрдВред
  2. vaadin-combo-box рддрддреНрд╡ рдХреЗ рдЗрдирдкреБрдЯ рдкрд░ рдХреНрд▓рд┐рдХ рдХрд░реЗрдВ рдФрд░ рдПрдХ рдЖрдЗрдЯрдо рдЦреЛрдЬреЗрдВред

рдмреНрд░рд╛рдЙрдЬрд╝рд░ рдкреНрд░рднрд╛рд╡рд┐рдд

  • [рдПрдХреНрд╕] рдХреНрд░реЛрдо
  • [ ] рдлрд╛рдпрд░рдлреЙрдХреНрд╕
  • [ ] рд╕рдлрд╛рд░реА
  • [ ] рдХрд┐рдирд╛рд░рд╛
  • [] рдЖрдИрдИ 11
  • [] рдЖрдИрдУрдПрд╕ рд╕рдлрд╛рд░реА
  • [рдПрдХреНрд╕] рдПрдВрдбреНрд░реЙрдЗрдб рдХреНрд░реЛрдо

рдРрд╕рд╛ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдпрд╣ рдХреЗрд╡рд▓ рдХреНрд░реЛрдо рдФрд░ рдПрдВрдбреНрд░реЙрдЗрдб рдХреНрд░реЛрдо рдореЗрдВ рд╣реИред рдореИрдВрдиреЗ рдлрд╝рд╛рдпрд░рдлрд╝реЙрдХреНрд╕, рд╕рдлрд╛рд░реА рдкрд░ рдкрд░реАрдХреНрд╖рдг рдХрд┐рдпрд╛ рдФрд░ рдпрд╣ рдХрд╛рдо рдХрд░ рд░рд╣рд╛ рд╣реИред

рдпрд╣ рд░рд┐рд▓реАрдЬрд╝ v1.2.0 рдХреЗ рд╕рд╛рде рдХрд╛рдо рдХрд░ рд░рд╣рд╛ рдерд╛ рдФрд░ рдмрдЧ v1.3.0 . рдореЗрдВ рд╢реБрд░реВ рд╣реБрдЖ

рд╕рдмрд╕реЗ рдЙрдкрдпреЛрдЧреА рдЯрд┐рдкреНрдкрдгреА

рдорджрдж рдХреЗ рд▓рд┐рдП рдзрдиреНрдпрд╡рд╛рдж рджреЛрд╕реНрддреЛрдВ, рдЗрд╕ рдореБрджреНрджреЗ рдХреЛ рдкреБрди: рдкреЗрд╢ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдпрд╣рд╛рдВ рдПрдХ рд╕реНрдирд┐рдкреЗрдЯ рд╣реИ:
https://jsfiddle.net/Saulis/we90kg2t/

рд╕рднреА 14 рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

рдирдорд╕реНрддреЗ!

рдореИрдВ рдЗрд╕ рдореБрджреНрджреЗ рдХреЛ рдПрдХ рд╢реБрджреНрдз рдкреЙрд▓рд┐рдорд░ рдРрдк рдореЗрдВ рдкреБрди: рдкреЗрд╢ рдирд╣реАрдВ рдХрд░ рд╕рдХрддрд╛, рдЗрд╕рд▓рд┐рдП рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдЗрд╕рдХрд╛ рдХреЛрдгреАрдп рдХреЗ рд╕рд╛рде рдХреБрдЫ рд▓реЗрдирд╛-рджреЗрдирд╛ рд╣реИред рджреЗрдЦреЗрдВ https://jsfiddle.net/Saulis/6kooy6d8/

рдХреНрдпрд╛ рдЖрдкрдХреЛ рдХрдВрд╕реЛрд▓ рдореЗрдВ рдХреЛрдИ рддреНрд░реБрдЯрд┐ рдорд┐рд▓ рд░рд╣реА рд╣реИ?

рдЖрдкрдХрд╛ jsfiddle рдореЗрд░реЗ рдмреНрд░рд╛рдЙрдЬрд╝рд░ рдкрд░ рдХрд╛рдо рдХрд░ рд░рд╣рд╛ рд╣реИред

рддреЛ, рдЖрдк рд╕рд╣реА рдХрд╣ рд░рд╣реЗ рд╣реИрдВ, рдпрд╣ рдХреЛрдгреАрдп рдХреЗ рдХрд╛рд░рдг рд╣реИред рдХреНрдпрд╛ рдЖрдкрдХреЗ рдкрд╛рд╕ рдЗрд╕ рдмрдЧ рдХреЛ рдкреБрди: рдЙрддреНрдкрдиреНрди рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП jsfiddle рдХреЗ рд▓рд┐рдП рдХреЛрдгреАрдп рдФрд░ рдмрд╣реБрд▓рдХ рд╡рд╛рд▓рд╛ рдЯреЗрдореНрдкрд▓реЗрдЯ рд╣реИ?

рдХрдВрд╕реЛрд▓ рдореЗрдВ рдХреЛрдИ рддреНрд░реБрдЯрд┐ рдирд╣реАрдВ рд╣реИред

рдореИрдВрдиреЗ рдХреЛрдгреАрдп рдФрд░ рдмрд╣реБрд▓рдХ рдХреЗ рд╕рд╛рде рдПрдХ рдкреНрд▓рдВрдХрд░ рдмрдирд╛рдпрд╛ рд▓реЗрдХрд┐рди рдХреЛрдИ рдмрдЧ рдирд╣реАрдВ рд╣реИ: https://plnkr.co/edit/pGqa0MXftgpMCSaAXCIO?p=preview

рдореИрдВ рдмрдЧ рдХрд╛ рдХрд╛рд░рдг рдЬрд╛рдирдиреЗ рдХреЗ рд▓рд┐рдП рдЬрд╛рдВрдЪ рдХрд░рдирд╛ рдЬрд╛рд░реА рд░рдЦреВрдВрдЧрд╛ред

рдореИрдВ рдкреЙрд▓рд┐рдорд░ 1.8.1 рдФрд░ рдХреНрд░реЛрдо рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдХреЗ рднреА рдЗрд╕рдХрд╛ рдЕрдиреБрднрд╡ рдХрд░ рд░рд╣рд╛ рд╣реВрдВред рдРрд╕рд╛ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдЕрдиреНрдп рдмреНрд░рд╛рдЙрдЬрд╝рд░реЛрдВ рдореЗрдВ рдХреЛрдИ рд╕рдорд╕реНрдпрд╛ рдирд╣реАрдВ рд╣реИред рдореБрдЭреЗ рд╡рд┐рд╢реНрд╡рд╛рд╕ рд╣реЛрдирд╛ рд╢реБрд░реВ рд╣реЛ рд░рд╣рд╛ рд╣реИ рдХрд┐ рдХреНрд░реЛрдо рдореЗрдВ рдмрдбрд╝реЗ рдРрдкреНрд╕ рдХреЗ рд▓рд┐рдП рджреМрдбрд╝ рдХреА рд╕реНрдерд┐рддрд┐ рд╣реИ рдЬреЛ рдРрд╕рд╛ рд╣реЛрдиреЗ рдХрд╛ рдХрд╛рд░рдг рдмрди рд░рд╣реА рд╣реИред рдкреБрди: рдкреБрд╖реНрдЯрд┐ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП, рд╡реИрдбрд┐рди-рдХреЙрдореНрдмреЛ-рдмреЙрдХреНрд╕ 1.2.0 рдХреЗ рд╕рд╛рде рдареАрдХ рдХрд╛рдо рдХрд░рддрд╛ рд╣реИ рдФрд░ 1.3.3 рдореЗрдВ рд╕рд╣реА рдврдВрдЧ рд╕реЗ рдХрд╛рдо рдирд╣реАрдВ рдХрд░рддрд╛ рд╣реИ

@flyweight рдХреНрдпрд╛ рдЖрдк рдПрдХ jsfiddle рдЙрддреНрдкрдиреНрди рдХрд░рдиреЗ рдореЗрдВ рд╕рдХреНрд╖рдо рд╣реИрдВ рдЬрд╣рд╛рдВ рд╕рдорд╕реНрдпрд╛ рд╣реЛрддреА рд╣реИ?

рдореИрдВ рдпрд╣ рднреА рдЬрд╛рдВрдЪ рдХрд░рдиреЗ рдХреА рдХреЛрд╢рд┐рд╢ рдХрд░ рд░рд╣рд╛ рд╣реВрдВ рдХрд┐ рдпрд╣ рдХрд╣рд╛рдВ рд╣реЛ рд╕рдХрддрд╛ рд╣реИ рд▓реЗрдХрд┐рди рдореБрдЭреЗ рд╡рд╣реА рдкрд░рд┐рдгрд╛рдо рдорд┐рд▓ рд░рд╣реЗ рд╣реИрдВ рдЬреИрд╕реЗ @ florent1933

рдмрд╕ рдзреНрдпрд╛рди рджреЗрдВ @Saulis : рдЕрдЧрд░ рдореИрдВ рдпрд╣рд╛рдВ рджрд┐рдЦрд╛рдП рдЧрдП рдЖрдЗрдЯрдо рдХреЗ рд▓рд┐рдП рдЖрдкрдХреЗ рдЯреЗрдореНрдкрд▓реЗрдЯ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рддрд╛ рд╣реВрдВ, рддреЛ рдореБрдЭреЗ рд╕рдорд╕реНрдпрд╛ рджрд┐рдЦрд╛рдИ рдирд╣реАрдВ рджреЗ рд░рд╣реА рд╣реИред рдпрд╣ рдХреЗрд╡рд▓ рдореЗрд░реЗ рд▓рд┐рдП рдкреНрд░рдХрдЯ рд╣реЛрддрд╛ рд╣реИ рдпрджрд┐ рдореИрдВ рдПрдХ рдХрд╕реНрдЯрдо рдЯреЗрдореНрдкрд▓реЗрдЯ рд╢рд╛рдорд┐рд▓ рдирд╣реАрдВ рдХрд░рддрд╛ рд╣реВрдВред

рдореЗрд░реЗ рдкрд╛рд╕ @ florent1933 рдЬреИрд╕реА рд╣реА рд╕рдорд╕реНрдпрд╛ рд╣реИ рдФрд░ рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдореБрдЭреЗ рдкрддрд╛ рд╣реИ рдХрд┐ рд╕рдорд╕реНрдпрд╛ рдХреНрдпрд╛ рд╣реИред рдореИрдВ рдПрдХ рдкреЙрд▓рд┐рдорд░ рд╕реАрдПрд▓рдЖрдИ рдЯреЗрдореНрдкрд▓реЗрдЯ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░ рд░рд╣рд╛ рд╣реВрдВ рдЬреЛ index.html рдлрд╝рд╛рдЗрд▓ рдореЗрдВ рдХреБрдЫ рдкреЙрд▓рд┐рдорд░ рдХреЙрдиреНрдлрд╝рд┐рдЧрд░реЗрд╢рди рд╡рд┐рдХрд▓реНрдк рдмрдирд╛рддрд╛ рд╣реИред рдбрд┐рдлрд╝реЙрд▓реНрдЯ рд░реВрдк рд╕реЗ рдРрд╕рд╛ рджрд┐рдЦрддрд╛ рд╣реИ:

window.Polymer = {
  dom: 'shadow',
  lazyRegister: true,
};

DOM рдЧреБрдг рдбрд┐рдлрд╝реЙрд▓реНрдЯ рд░реВрдк рд╕реЗ 'рдЫрд╛рдпрд╛' рдкрд░ рд╕реЗрдЯ рд╣реЛрддрд╛ рд╣реИ, рд▓реЗрдХрд┐рди рдпрджрд┐ рдЖрдк рдЗрд╕реЗ 'рдЫрд╛рдпрд╛рджрд╛рд░' рдореЗрдВ рдмрджрд▓рддреЗ рд╣реИрдВ рддреЛ рд╕рдорд╕реНрдпрд╛ рд╣рд▓ рд╣реЛ рдЬрд╛рддреА рд╣реИред рдЦреЛрдЬ рдХрд░рддреЗ рд╕рдордп рддрддреНрд╡ рдЖрдЗрдЯрдо рдХреЛ рдбреБрдкреНрд▓рд┐рдХреЗрдЯ рдирд╣реАрдВ рдХрд░рддрд╛ рд╣реИред рдХреНрдпрд╛ рдЗрд╕реЗ 'рдЫрд╛рдпрд╛' рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдХреЗ рдХрд╛рдо рдХрд░рдиреЗ рдХрд╛ рдХреЛрдИ рддрд░реАрдХрд╛ рд╣реИ рдпрд╛ рддрддреНрд╡ рдХреЗрд╡рд▓ 'рдЫрд╛рдпрд╛' рдХреЗ рд╕рд╛рде рдХрд╛рдо рдХрд░рдирд╛ рдЪрд╛рд╣рд┐рдП?

@ Andres0101 рдиреЗ рдКрдкрд░ рдЬреЛ рдХрд╣рд╛ рд╣реИ,

@ Andres0101 : рдЗрд╕ рдореБрджреНрджреЗ рдХреА рд╕рдорд╕реНрдпрд╛ рдХреЛ рдЦреЛрдЬрдиреЗ рдХреЗ рд▓рд┐рдП рдЕрдЪреНрдЫрд╛ рдХрд╛рдо ЁЯСН

рдпрд╣ рдмрд╣реБрдд рдЕрдЪреНрдЫрд╛ рд╣реЛрдЧрд╛ рдпрджрд┐ рдХрдореНрдмреЛрдмреЙрдХреНрд╕ рдЫрд╛рдпрд╛ рдбреЛрдо рдХреЗ рд╕рд╛рде рдХрд╛рдо рдХрд░ рд╕рдХрддрд╛ рд╣реИ рдХреНрдпреЛрдВрдХрд┐ рдореИрдВ рдЫрд╛рдпрд╛рджрд╛рд░ рдбреЛрдо рдХрд╛ рдЙрдкрдпреЛрдЧ рдирд╣реАрдВ рдХрд░ рд╕рдХрддрд╛ред

рдорджрдж рдХреЗ рд▓рд┐рдП рдзрдиреНрдпрд╡рд╛рдж рджреЛрд╕реНрддреЛрдВ, рдЗрд╕ рдореБрджреНрджреЗ рдХреЛ рдкреБрди: рдкреЗрд╢ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдпрд╣рд╛рдВ рдПрдХ рд╕реНрдирд┐рдкреЗрдЯ рд╣реИ:
https://jsfiddle.net/Saulis/we90kg2t/

рдореБрдЭреЗ рдирд╣реАрдВ рдкрддрд╛ рдХрд┐ рдЖрдкрдиреЗ рджреЗрдЦрд╛ рд╣реИ рдпрд╛ рдирд╣реАрдВ, рд▓реЗрдХрд┐рди рдЬрдм рд╣рдо рдЦреЛрдЬ рдХрд░рддреЗ рд╣реИрдВ рддреЛ рдХреАрдмреЛрд░реНрдб рдбрд╛рдЙрди рдПрд░реЛ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдХреЗ рдбреБрдкреНрд▓рд┐рдХреЗрдЯ рдЖрдЗрдЯрдо рдХрд╛ рдЪрдпрди рдХрд░рдирд╛ рд╕рдВрднрд╡ рдирд╣реАрдВ рд╣реЛрддрд╛ рд╣реИред рдЗрд╕ рдмрд┐рдВрджреБ рдкрд░ рд╕рдЯреАрдХ рдЪрд╛рд╣рддрд╛ рдерд╛ред

@ рдПрд▓рдПрдо 450 рдПрди : рдЖрдк рд╕рд╣реА рдХрд╣ рд░рд╣реЗ рд╣реИрдВ! рдЖрд╢реНрдЪрд░реНрдпрдЬрдирдХ рдЦрдмрд░!

4f02971 рдХреЛ @LM450N рдХреЗ рд▓рд┐рдП рдзрдиреНрдпрд╡рд╛рдж!

рдореИрдВ рдЗрд╕ рдореБрджреНрджреЗ рдкрд░ v2.0.0-alpha1 рдореЗрдВ рдореБрд╣рд░ рд▓рдЧрд╛рдиреЗ рдЬрд╛ рд░рд╣рд╛ рд╣реВрдВ рдФрд░ рдЗрд╕рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдЖрдЧреЗ рдмрдврд╝рдиреЗ рдХреА рдЕрдиреБрд╢рдВрд╕рд╛ рдХрд░рддрд╛ рд╣реВрдВред

1.3.x рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдиреЗ рд╡рд╛рд▓реЛрдВ рдХреЗ рд▓рд┐рдП, рдореИрдВрдиреЗ 1.x рд╢рд╛рдЦрд╛ рдХреЗ рд▓рд┐рдП рдлрд┐рдХреНрд╕ рдЪреЗрд░реА-рдкрд┐рдХ рдХрд┐рдпрд╛ рд╣реИ - рд▓реЗрдХрд┐рди рд╕рд╛рд╡рдзрд╛рди рд░рд╣реЗрдВ, рдХрд╕реНрдЯрдо рдЖрдЗрдХрди рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдиреЗ рдХреЗ рд╕рдВрдмрдВрдз рдореЗрдВ рдЙрд╕ рд╢рд╛рдЦрд╛ рдореЗрдВ рдХреБрдЫ рдмреНрд░реЗрдХрд┐рдВрдЧ рдкрд░рд┐рд╡рд░реНрддрди рд╣реИрдВ - рд╡реЗ slot рдЙрдкрдпреЛрдЧ рдХрд░рддреЗ рд╣реИрдВ рдХрдХреНрд╖рд╛рдУрдВ рдХреЗ рдмрдЬрд╛рдп

рдХреНрдпрд╛ рдпрд╣ рдкреГрд╖реНрда рдЙрдкрдпреЛрдЧреА рдерд╛?
0 / 5 - 0 рд░реЗрдЯрд┐рдВрдЧреНрд╕

рд╕рдВрдмрдВрдзрд┐рдд рдореБрджреНрджреЛрдВ

OlliTietavainenVaadin picture OlliTietavainenVaadin  ┬╖  6рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

mas4ivv picture mas4ivv  ┬╖  16рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

heruan picture heruan  ┬╖  14рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

joostdebruijn picture joostdebruijn  ┬╖  6рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

web-padawan picture web-padawan  ┬╖  5рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ