I want to implement the following Javascript code in Coffeescript
App.ItemView = Ember.View.extend({
classNameBindings: ['itemId'],
itemId: function() {
console.log(this.get('content'));
return "item-%#".fmt(this.get('content.id'));
}.property('content.id'),
templateName: 'item'
});
Here is what I have so far in coffeescript:
App.ItemView = Ember.View.extend(
classNameBindings: ['itemId']
itemId: ->
console.log this.get('content')
contentId = this.get('content.id')
"item-#{contentId}");
.property('content.id')
templateName: 'item'
)
I get:
Error: Parse error on line 11: Unexpected '.'
The issue seems to be with the dot in .property('content.id')
. I dont know how this translates into Coffeescript. How can I properly implement this view in Coffeescript?
It's beeing a quite long time, but I think this should be written like this:
App.ItemView = Ember.View.extend(
classNameBindings: ['itemId']
itemId: (->
console.log this.get('content')
contentId = this.get('content.id')
"item-#{contentId}");
).property('content.id')
templateName: 'item'
)
itemId: (->
content = #get 'content'
if content
return 'item-%#'.fmt(content.get 'id')
null
).property('content.id')
You have to protect computed properties from values that might not be defined yet. That is, your code is fine if there's already an id property on the content object. If content is undefined, then you're not going to be able to look up its ID property and you'll probably see a complaint.
You can also use
itemId: Ember.computed(->
..
).property('content.id')
and a similar pattern for observers. In fact, an observer would also accomplish the same thing without the conditional:
itemId: null
contentIdChanged: (->
#set 'itemId', 'item-%#'.fmt(#get 'content.id')
).observes('content.id')
I like to use Ember.computed.
itemId: Ember.computed 'firstName', 'lastName', ->
"#{#get('firstName')} #{#get('lastName')}"
Related
I need to introduce object with my own properties in columnDefs object.
After, I did it, I see in dev console
So, here has been written, that I could mean __metadata__ property. Does this property suit to mine purpose?
I've not found any information in types and docs about this property
ColDef has no custom state property that you could use. Certainly do not touch __metadata__. The name sounds like some internal implementation detail.
You can store your metadata in a separate object, for example using colId as a key:
columnDefs: ColDef[] = [
{
colId: 'id',
field: 'id'
},
{
colId: 'name',
field: 'name'
}
];
columnMetadata: {
id: 'something custom',
name: 'custom data'
}
private getColumnMetadata(column: Column) {
return this.columnMetadata[column.getColId()];
}
What is the proper syntax for a object child as a column prop?
const cs = new pgp.helpers.ColumnSet([
{
name: 'uid',
prop: 'id'
}, {
name: 'created_at'
prop: 'member.created_at // <-- error
}
])
Cant seem to get this to work.
While the regular pg-promise query formatting (using Named Parameters) supports nested properties, specifically helpers do not, due to certain templates-related complexity.
However, it is not necessary, because ColumnSet syntax for columns is very flexible (see type Column), and supports dynamic property resolution.
Simply update the column to use init, to get the value dynamically:
{
name: 'created_at',
init: c => c.source.member.created_at
}
For the field, we go to the source object, as per documentation, and take what we need.
Alternative syntax:
{
name: 'created_at',
init(c) {
// with this syntax, this = c.source
return this.member.created_at;
}
}
MongoDb returns ids of the form _id. I would like to make sure that the frontend (ember.js app) always receives id instead. I could write a serializer on the client, but I think there's probably a much easier solution that could either be implemented at the Database level or within the express server app.
I tried using virtual attributes, but this did'nt seem to work.
ActionSchema = mongoose.Schema(
title: type: mongoose.Schema.Types.Mixed
reduction: type: Number
description: type: mongoose.Schema.Types.Mixed
category: type: String
)
ActionSchema.virtual('id').get(->
#_id
)
I solved this using custom toJSON method. In model after schema declaration:
schema.options.toJSON =
transform: (doc, ret, options) ->
ret.id = ret._id
delete ret._id
delete ret.__v
ret
Then in my controller I've used item.toJSON() when I wanted to return correctly formatted JSON response.
I found my answer using this blog post:
http://ryanchristiani.com/working-with-ember-data-node-express-and-mongodb/
The simple way is to write a rest serializer in Ember like so:
export default DS.RESTSerializer.extend({
primaryKey: '_id',
serializeId: function(id) {
return id.toString();
}
});
I have a code in Javascript as :
_.each(this.collection.models, function (student) {
$(this.el).append(new StudCloneItemView({ model: student }).el);
}, this);
While I am writing This in coffescript as
_.each this.collection.models , (student) =>
$(#el).append new Item ({ model:student }).el
which generates
_.each(this.collection.models, function(student) {
return $(_this.el).append(new Item({
model: student
}.el));
});
Which isn't desirable as per my requirement . The last segment of "this" element has been missing into the generated javascript . Its very important.
How would I generate The javascript as mentioned on top using the coffeescript I mentioned for _.each ????
Is there anyway to do that ?? Or am I missing any syntax ?
Your JavaScript:
_.each(this.collection.models, function (student) {
$(this.el).append(new StudCloneItemView({ model: student }).el);
}, this);
and what your => CoffeeScript produces:
var _this = this; // This is somewhere above your _.each in the generated JS
_.each(this.collection.models, function(student) {
return $(_this.el).append(new Item({
model: student
}.el));
});
are functionally equivalent. You don't need the context argument to _.each since the => generates an alias for this (called _this) that is used inside the callback.
As an aside, Backbone collections have various Underscore methods mixed in so you don't have to say _.each(#collection.models, ...), you can use each directly on the collection:
#collection.each (student) =>
#$el.append(new StudCloneItemView(model: student).el)
I've also switched to the pre-built $el that your view already has, there's no need to build a new jQuery object on each iteration.
like this:
_.each #collection.models, ((student) ->
$(#el).append new StudCloneItemView(model: student).el
), this
We have recently switched from ExtJS 3.2 to 3.4 and found that grids with check box selection model stop working. It turns out that such configuration is not allowed any more:
var gridConfig = {
xtype: 'grid',
store: myStore,
columns:[
new Ext.grid.CheckboxSelectionModel(),
{
id: 'Name',
header: 'Inland Carrier',
dataIndex: 'Name'
}],
sm: new Ext.grid.CheckboxSelectionModel({
checkOnly: true
})
};
Instead selection model object must be created once and then passed both to column collection and sm property.
The problem now is that we have a very long configuration object with multitude of grids. Previously selection model was specified locally as per the sample above. But now we have to allot a variable for each selection model object, invent unique name for it, and keep these variables far away from the place where they are used. It's extremely inconvenient.
Is it possible somehow to specify selection model in one place? Or maybe to create it in one property initializer and reference this object in the second place?
you can add sm to cm after initialization of grid.
ie:
var gridConfig = {
xtype: 'grid',
store: myStore,
columns:[{
id: 'Name',
header: 'Inland Carrier',
dataIndex: 'Name'
}],
sm: new Ext.grid.CheckboxSelectionModel({
checkOnly: true
})
};
var grid = new Ext.grid.GridPanel( gridConfig );
grid.getColumnModel().config.unshift( grid.getSelectionModel() );