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

ember-named-yields

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

ember-named-yields

A stop-gap for the named yields RFC and based off the experimentation here.

Demo

Install

ember install ember-named-yields

Usage

Setup the named yields in your component template:

{{named-yield 'header'}}

{{yield (hash
  header=(component 'block-for' 'header')
  footer=(component 'block-for' 'footer'
    args=(hash name='footer')
  )
)}}

{{named-yield 'footer'}}

The {{yield}} is the body yield in this example.

Consume

Now to use this component:

{{#custom-card as |yields|}}
  Body content anywhere in the main block

  {{#yields.header}}
    Header content here
  {{/yields.header}}

  {{#yields.footer as |args|}}
    {{capitalize args.name}} content here
  {{/yields.footer}}
{{/custom-card}}

Caveats

This named yield implementation adds extraneous DOM elements to make this work, so keep that in mind when usingthis addon.

Advanced

Topics beyond the basic usage.

Context

Both named-yield and block-for components take a second positional param which is "optional" since we fallbackto a private API, i.e. parentView. If you don't want to use the private API, set the context manually.

{{named-yield 'header' this}}

{{yield (hash
  header=(component 'block-for' 'header' this)
  footer=(component 'block-for' 'footer' this)
)}}

{{named-yield 'footer' this}}

Dynamic Yield Blocks

To allow more control to the end user, e.g. dynamically set the block to yield to.

{{yield (hash
  for=(component 'block-for')
)}}

And can be used like so:

{{#my-card as |yields|}}
  {{#yields.for 'header'}}
    Header
  {{/yields.for}}
{{/my-card}}

Which allows using concat or other helpers to dynamically set the name.

Appending

By default if you call a block-for multiple times, it overwrites the previous content. Sometimesyou might want to append to the previous content.

{{#yields.header append=true}}
  A
{{/yields.header}}

{{#yields.header append=true}}
  B
{{/yields.header}}

Now the header will have 'AB' as it's contents.

Contribute

See the CONTRIBUTING.md.

 相关资料
  • Guice还提供了另一种映射绑定的方法,而无需创建自定义注释。 它允许使用@Named注释。 使用命名注释进行映射 bind(SpellChecker.class).annotatedWith(Names.named("OpenOffice")).to(OpenOfficeWordSpellCheckerImpl.class); 使用@Named注释进行注入 @Inject public Tex

  • 管道用于相关过程之间的通信。 我们可以使用管道进行无关的进程通信吗,比方说,我们想从一个终端执行客户端程序,从另一个终端执行服务器程序? 答案是否定。那么我们如何才能实现无关的流程沟通,简单的答案就是命名管道。 即使这适用于相关流程,但使用命名管道进行相关流程通信也没有任何意义。 我们使用一个管道进行单向通信,使用两个管道进行双向通信。 相同条件是否适用于命名管道。 答案是否定的,我们可以使用单个

  • 主要内容:使用@Named 注解映射,使用@Named 注解注入,Google Guice @Named 注解完整示例,输出Google Guice 还提供了另一种无需创建自定义注释即可映射绑定的方法。它允许使用@Named 注解。 使用@Named 注解映射 使用@Named 注解注入 Google Guice @Named 注解完整示例 创建一个名为 GuiceTester 的 Java 类。 GuiceTester.java 输出 编译并运行该文件,您将看到以下输出。

  • In the Navigate to a new screen and back recipe, we learned how to Navigate to a new screen by creating a new route and pushing it to the Navigator. However, if we need to navigate to the same screen

  • In the Navigate to a new screen and back recipe, we learned how to Navigate to a new screen by creating a new route and pushing it to the Navigator. However, if we need to navigate to the same screen

  • 我有一个烧瓶应用程序存在以下错误: 所以,我在Web服务器中的根是: /主页/网页/ltw1413/html 在html文件夹中,我有: 一个名为“annotaria”的文件夹 我的文件. wsgi是: 在我的文件夹“annotaria”中,我有: “静态”文件夹:在样式表和js中 “Templates”文件夹:在html中 “run.py”:我的应用程序所在的python文件 跑py是这样的: