javascript - 如何访问其各自 Controller 内模板中的变量？

Question

我正在尝试在 Ember 中创建某种搜索功能，但在将输入字段的值传递给 Controller ​​进行处理时遇到了一些问题。

这是我的

App.ApplicationController = Ember.Controller.extend({
    actions: {
        handle_search: function() {
            var search_text = this.get('controllers.search_text');
            console.log(search_text);
        }
    }
});

这就是我在模板中的内容

                <span class="input-group-addon"><i class="fa fa-search"></i></span>
                {{input type="text" valueBinding=search_text class="form-control" placeholder="Search..."}}

                <span class="input-group-btn">
                    <button {{action 'handle_search'}} class="btn btn-default" type="button">Search</button>
                </span>

这给了我以下错误

WARNING: You're attempting to render a view by passing valueBinding=search_text to a view helper, but this syntax is ambiguous. You should either surround search_text in quotes or remove `Binding` from valueBinding. ember.js:3521

Error Uncaught object 

所以我也尝试了 value 而不是 valueBinding 和 this.controller.get('search_text') 而不是 this.get(' controllers.search_text');` 我得到这个错误

未捕获的类型错误:无法读取未定义的 app.js:127 的属性“get”

那么我如何访问在模板中设置的 Controller 中的值呢？ search_text 变量只是我在模板中创建的一些名称，因此我可以尝试访问 Controller 上的输入值。

Answer 1

属性存在于 Controller 中，因此您可以使用 this.get('foo')

App.ApplicationController = Ember.Controller.extend({
    actions: {
        handle_search: function() {
            var search_text = this.get('search_text');
            console.log(search_text);
        }
    }
});

只有在使用名称的文本版本绑定(bind)到属性时才应使用 valueBinding，例如valueBinding='foo'。如果您想直接绑定(bind)到一个属性，您只需执行 value=foo。

 {{input type="text" value=search_text class="form-control" placeholder="Search..."}}

http://emberjs.jsbin.com/weyobivu/1/edit