EmberJS路由器指定查询参数

EmberJS 路由器指定查询参数

描述查询参数在路由驱动控制器上指定。查询参数在URL中绑定,并配置查询参数,它们必须在控制器上声明,并且它们应该是活动的。定义有助于渲染模板的数组的查询参数过滤器的计算属性。语句Ember.Controller.extend({

queryParams: ['queryParameter'],

queryParameter: null

});例子<!DOCTYPE html>

<html>

<head>

<title>Emberjs Specifying Query Parameters </title>

<!-- CDN's -->

<script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/3.0.1/handlebars.min.js"&gt;&lt;/script&gt;

<script src="https://code.jquery.com/jquery-2.1.3.min.js"&gt;&lt;/script&gt;

<script src="https://cdnjs.cloudflare.com/ajax/libs/ember.js/1.10.0/ember.min.js"&gt;&lt;/script&gt;

<script src="https://builds.emberjs.com/tags/v1.10.0-beta.3/ember-template-compiler.js"&gt;&lt;/script&gt;

<script src="https://builds.emberjs.com/release/ember.debug.js"&gt;&lt;/script&gt;

<script src="https://builds.emberjs.com/beta/ember-data.js"&gt;&lt;/script&gt;

</head>

<body>

<script type="text/x-handlebars" data-template-name="application">

<h3>Enter values to add:</h3>

<!-- sending action to the addQuery method -->

<form {{action "addQuery" on="submit"}}>

{{input value=queryParma}}

<input type="submit" value="Send Tag"/>

</form>

</script>

  &lt;script type="text/javascript"&gt;

App = Ember.Application.create();

App.ApplicationController = Ember.ArrayController.extend({

//specifyint 'query' as one of controller's query parameter

queryParams: ['query'],

//initialize the query value

query: null,

//defining a computed property queryParam

queryParma: Ember.computed.oneWay('query'),

actions: {

addQuery: function() {

//setting up the query parameters and displaying it

this.set('query', this.get('queryParma'));

document.write(this.get('query'));

}

}

});

&lt;/script&gt;

</body>

</html>输出让我们执行以下步骤,看看上面的代码如何工作:将上面的代码保存在routing_qry_param.html文件中在浏览器中打开此HTML文件。