代码之家 › 专栏 › 技术社区 › dangerChihuahua007

如何在大豆模板中加载依赖项?

google-closure-templates google-closure

2

dangerChihuahua007 · 技术社区 · 14 年前

在我的Google闭包代码中,我制作了一个表示CSS类名称的枚举,并希望在我的大豆模板中使用这个枚举:

/**
 * Lists a single widget.
 * @param widget The widget to be listed.
 */
{template .singleWidgetListing}
<div class='{app.ui.ClassNames.WIDGET_LISTING}'>
  <span class='{app.ui.ClassNames.WIDGET_LISTING_ITEM}'>{$widget.title}</span>
</div>
{/template}

我试过了 goog.require('app.ui.ClassNames'); 在大豆模板文件的顶部没有用。做这件事的标准方法是什么?

2 回复 | 直到 14 年前

1

2

Christopher Peisert 14 年前

建议的方法是避免引用 globals 在闭包模板中:

注: 除非绝对必要,否则避免使用渲染时全局变量,因为这会导致模板和运行时环境之间的紧密耦合。

应改为使用模板参数:

{namespace myapp}

/**
 * Lists a single widget.
 * @param widget The widget to be listed.
 * @param classNames Map of CSS classes for styling widgets.
 */
{template .singleWidgetListing}
  <div class="{$classNames.WIDGET_LISTING}">
    <span class="{$classNames.WIDGET_LISTING_ITEM}">{$widget.title}</span>
  </div>
{/template}

然后将从JavaScript调用该模板,如下所示:

myapp.singleWidgetListing(
    {widget: myWidgetInstance, classNames: app.ui.ClassNames});

看见 Using Closure Templates in JavaScript 。

2

0

walrus 13 年前

还可以考虑将CSS类的映射作为注入的数据传递到顶级模板中( https://developers.google.com/closure/templates/docs/concepts#injecteddata )这样你就不必把它传递给需要它的子模板了。