EmberJS 使用夹具
使用夹具
夹具用于开发客户端Web应用程序。您可以将夹具附加到保存样本数据的模型类。
App.ApplicationAdapter = DS.FixtureAdapter;
DS.Model.extend({
//define data model
});
FIXTURES =[ //define sample data ];
在上面的代码中,FIXTURE保存要在浏览器上显示的样本数据。
例子
<!DOCTYPE html>
<html>
<head>
<title>Emberjs Using Fixtures</title>
<!-- CDN's-->
<script src="/attachements/w3c/handlebars.min.js"></script>
<script src="/attachements/w3c/jquery-2.1.3.min.js"></script>
<script src="/attachements/w3c/ember.min.js"></script>
<script src="/attachements/w3c/ember-template-compiler.js"></script>
<script src="/attachements/w3c/ember.debug.js"></script>
<script src="/attachements/w3c/ember-data.js"></script>
</head>
<body>
<script type="text/x-handlebars" data-template-name="index">
<h2>Players Name:</h2>
{{#each person in controller}}
<p>{{person.id}}: <b>{{person.name}}</b></p>
{{/each}}
</script>
<script type="text/javascript">
App = Ember.Application.create();
//The store cache of all records available in an application
App.Store = DS.Store.extend({
//adapter translating requested records into the appropriate calls
adapter: 'DS.FixtureAdapter'
});
//Creating A Fixture Adapter
App.ApplicationAdapter = DS.FixtureAdapter.extend();
//Define Your Model
App.Person = DS.Model.extend({
name: DS.attr('string')
});
App.IndexRoute = Ember.Route.extend({
//index route
model: function() {
//return the person details
return this.store.find('person');
}
});
//Attach Fixtures To The Model Class
App.Person.FIXTURES = [
{id: 1, name: 'Virat'},
{id: 2, name: 'Raina'},
{id: 3, name: 'Dhoni'}];
</script>
</body>
</html>
输出
让我们执行以下步骤,看看上面的代码如何工作:
将以上代码保存在 fixture_model.html 文件中
在浏览器中打开此HTML文件。