6

由于 ember 不喜欢直接 dom 操作,弹出库toastr 是否无法与 Ember 一起使用?有没有像这个一样的其他库可以很好地与 ember 配合使用?

编辑

即使通过下面发布的工作示例,我也无法使其在本地工作。我终于使用了Pine Notify,它立即生效。

4

1 回答 1

8

这在 Ember 中运行良好,您只需在正确的位置处理事件。“正确的地方”取决于您的实施。如果您希望从视图中的按钮触发此操作,则需要使用{{action}}传递操作名称的帮助程序。例子:

<script type="text/x-handlebars" >
    <button class="btn btn-info" {{action showInfo}}>Info</button>
</script>

在上面的模板中,我说按钮应该触发showInfo事件,所以Controller负责这个视图应该有一个同名的函数:

App.ApplicationController = Em.ArrayController.extend({
    showInfo: function() {
        toastr.info('This is some sample information');
    }
});

您还可以让视图处理事件;下面的代码定义了一个click事件,因此如果您单击视图中的任意位置,它将运行您的函数:

App.OtherView = Em.View.extend({
    click: function(e) {
        toastr.error('This is some sample error');
    }
});

并且在您的 Handlebars 模板中,您不必告诉操作,因为您已经在视图类中说要处理该click视图的事件,因此您可以简单地渲染视图并为其设置样式:

{{#view App.OtherView class="btn btn-danger"}}
    Error
{{/view}}

这是 JSFiddle 中的一个示例:http: //jsfiddle.net/schawaska/YZwDh/

我建议您阅读有关{{action}}助手的 Ember 指南

于 2013-02-28T21:51:58.987 回答