Ember._MetamorphView Class packages/ember-views/lib/compat/metamorph_view.js:41
PRIVATE
Extends: Ember.View
Uses: Ember._Metamorph
Defined in: packages/ember-views/lib/compat/metamorph_view.js:41
Module: ember-views
Methods
- _classStringForProperty
- _contextDidChange
- _isVisibleDidChange
- _lazyInjections
- _onLookup
- _scheduledDestroy
- addObserver
- beginPropertyChanges
- cacheFor
- create
- decrementProperty
- destroy
- eachComputedProperty
- endPropertyChanges
- extend
- get
- getProperties
- getWithDefault
- has
- hasObserverFor
- incrementProperty
- init
- metaForProperty
- nearestChildOf
- nearestInstanceOf
- notifyPropertyChange
- off
- on
- one
- propertyDidChange
- propertyWillChange
- removeAllChildren
- removeObserver
- renderBlock
- reopen
- reopenClass
- send
- set
- setProperties
- toString
- toggleProperty
- trigger
- willDestroy
Properties
_classStringForProperty
(property)
private
Given a property name, returns a dasherized version of that property name if the property evaluates to a non-falsy value.
For example, if the view has property isUrgent
that evaluates to true,
passing isUrgent
to this method will return "is-urgent"
.
Parameters:
- property
_contextDidChange
private
If a value that affects template rendering changes, the view should be re-rendered to reflect the new value.
_isVisibleDidChange
private
When the view's isVisible
property changes, toggle the visibility
element of the actual DOM element.
_lazyInjections
Object
private
Returns a hash of property names and container names that injected properties will lookup on the container lazily.
Returns:
- Object
- Hash of all lazy injected property keys to container names
_onLookup
private
Provides lookup-time type validation for injected properties.
_scheduledDestroy
private
Invoked by the run loop to actually destroy the object. This is
scheduled for execution by the destroy
method.
addObserver
(key, target, method)
public
Adds an observer on a property.
This is the core method used to register an observer for a property.
Once you call this method, any time the key's value is set, your observer will be notified. Note that the observers are triggered any time the value is set, regardless of whether it has actually changed. Your observer should be prepared to handle that.
You can also pass an optional context parameter to this method. The context will be passed to your observer method whenever it is triggered. Note that if you add the same target/method pair on a key multiple times with different context parameters, your observer will only be called once with the last context you passed.
Observer Methods
Observer methods you pass should generally have the following signature if
you do not pass a context
parameter:
1 |
fooDidChange: function(sender, key, value, rev) { }; |
The sender is the object that changed. The key is the property that changes. The value property is currently reserved and unused. The rev is the last property revision of the object when it changed, which you can use to detect if the key value has really changed or not.
If you pass a context
parameter, the context will be passed before the
revision like so:
1 |
fooDidChange: function(sender, key, value, context, rev) { }; |
Usually you will not need the value, context or revision parameters at the end. In this case, it is common to write observer methods that take only a sender and key value as parameters or, if you aren't interested in any of these values, to write an observer that has no parameters at all.
Parameters:
- key String
- The key to observer
- target Object
- The target object to invoke
- method String|Function
- The method to invoke.
beginPropertyChanges
Ember.Observable
private
Begins a grouping of property changes.
You can use this method to group property changes so that notifications
will not be sent until the changes are finished. If you plan to make a
large number of changes to an object at one time, you should call this
method at the beginning of the changes to begin deferring change
notifications. When you are done making changes, call
endPropertyChanges()
to deliver the deferred change notifications and end
deferring.
Returns:
cacheFor
(keyName)
Object
public
Returns the cached value of a computed property, if it exists. This allows you to inspect the value of a computed property without accidentally invoking it if it is intended to be generated lazily.
Parameters:
- keyName String
Returns:
- Object
- The cached value of the computed property, if any
create
(arguments)
public
static
Creates an instance of a class. Accepts either no arguments, or an object containing values to initialize the newly instantiated object with.
1 2 3 4 5 6 7 8 9 10 11 |
App.Person = Ember.Object.extend({ helloWorld: function() { alert("Hi, my name is " + this.get('name')); } }); var tom = App.Person.create({ name: 'Tom Dale' }); tom.helloWorld(); // alerts "Hi, my name is Tom Dale". |
create
will call the init
function if defined during
Ember.AnyObject.extend
If no arguments are passed to create
, it will not set values to the new
instance during initialization:
1 2 |
var noName = App.Person.create(); noName.helloWorld(); // alerts undefined |
NOTE: For performance reasons, you cannot declare methods or computed
properties during create
. You should instead declare methods and computed
properties when using extend
.
Parameters:
- arguments []
decrementProperty
(keyName, decrement)
Number
public
Set the value of a property to the current value minus some amount.
1 2 |
player.decrementProperty('lives'); orc.decrementProperty('health', 5); |
Parameters:
- keyName String
- The name of the property to decrement
- decrement Number
- The amount to decrement by. Defaults to 1
Returns:
- Number
- The new property value
destroy
Ember.Object
public
Destroys an object by setting the isDestroyed
flag and removing its
metadata, which effectively destroys observers and bindings.
If you try to set a property on a destroyed object, an exception will be raised.
Note that destruction is scheduled for the end of the run loop and does not happen immediately. It will set an isDestroying flag immediately.
Returns:
- Ember.Object
- receiver
eachComputedProperty
(callback, binding)
private
static
Iterate over each computed property for the class, passing its name
and any associated metadata (see metaForProperty
) to the callback.
Parameters:
- callback Function
- binding Object
endPropertyChanges
Ember.Observable
private
Ends a grouping of property changes.
You can use this method to group property changes so that notifications
will not be sent until the changes are finished. If you plan to make a
large number of changes to an object at one time, you should call
beginPropertyChanges()
at the beginning of the changes to defer change
notifications. When you are done making changes, call this method to
deliver the deferred change notifications and end deferring.
Returns:
extend
(mixins, arguments)
public
static
Creates a new subclass.
1 2 3 4 5 |
App.Person = Ember.Object.extend({ say: function(thing) { alert(thing); } }); |
This defines a new subclass of Ember.Object: App.Person
. It contains one method: say()
.
You can also create a subclass from any existing class by calling its extend()
method.
For example, you might want to create a subclass of Ember's built-in Ember.View
class:
1 2 3 4 |
App.PersonView = Ember.View.extend({ tagName: 'li', classNameBindings: ['isAdministrator'] }); |
When defining a subclass, you can override methods but still access the
implementation of your parent class by calling the special _super()
method:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
App.Person = Ember.Object.extend({ say: function(thing) { var name = this.get('name'); alert(name + ' says: ' + thing); } }); App.Soldier = App.Person.extend({ say: function(thing) { this._super(thing + ", sir!"); }, march: function(numberOfHours) { alert(this.get('name') + ' marches for ' + numberOfHours + ' hours.'); } }); var yehuda = App.Soldier.create({ name: "Yehuda Katz" }); yehuda.say("Yes"); // alerts "Yehuda Katz says: Yes, sir!" |
The create()
on line #17 creates an instance of the App.Soldier
class.
The extend()
on line #8 creates a subclass of App.Person
. Any instance
of the App.Person
class will not have the march()
method.
You can also pass Mixin
classes to add additional properties to the subclass.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
App.Person = Ember.Object.extend({ say: function(thing) { alert(this.get('name') + ' says: ' + thing); } }); App.SingingMixin = Mixin.create({ sing: function(thing){ alert(this.get('name') + ' sings: la la la ' + thing); } }); App.BroadwayStar = App.Person.extend(App.SingingMixin, { dance: function() { alert(this.get('name') + ' dances: tap tap tap tap '); } }); |
The App.BroadwayStar
class contains three methods: say()
, sing()
, and dance()
.
Parameters:
- mixins [Mixin]
- One or more Mixin classes
- arguments [Object]
- Object containing values to use within the new class
get
(keyName)
Object
public
Retrieves the value of a property from the object.
This method is usually similar to using object[keyName]
or object.keyName
,
however it supports both computed properties and the unknownProperty
handler.
Because get
unifies the syntax for accessing all these kinds
of properties, it can make many refactorings easier, such as replacing a
simple property with a computed property, or vice versa.
Computed Properties
Computed properties are methods defined with the property
modifier
declared at the end, such as:
1 2 3 |
fullName: function() { return this.get('firstName') + ' ' + this.get('lastName'); }.property('firstName', 'lastName') |
When you call get
on a computed property, the function will be
called and the return value will be returned instead of the function
itself.
Unknown Properties
Likewise, if you try to call get
on a property whose value is
undefined
, the unknownProperty()
method will be called on the object.
If this method returns any value other than undefined
, it will be returned
instead. This allows you to implement "virtual" properties that are
not defined upfront.
Parameters:
- keyName String
- The property to retrieve
Returns:
- Object
- The property value or undefined.
getProperties
(list)
Object
public
To get the values of multiple properties at once, call getProperties
with a list of strings or an array:
1 2 |
record.getProperties('firstName', 'lastName', 'zipCode'); // { firstName: 'John', lastName: 'Doe', zipCode: '10011' } |
is equivalent to:
1 2 |
record.getProperties(['firstName', 'lastName', 'zipCode']); // { firstName: 'John', lastName: 'Doe', zipCode: '10011' } |
Parameters:
- list String...|Array
- of keys to get
Returns:
- Object
getWithDefault
(keyName, defaultValue)
Object
public
Retrieves the value of a property, or a default value in the case that the
property returns undefined
.
1 |
person.getWithDefault('lastName', 'Doe'); |
Parameters:
- keyName String
- The name of the property to retrieve
- defaultValue Object
- The value to return if the property value is undefined
Returns:
- Object
- The property value or the defaultValue.
has
(name)
Boolean
public
Checks to see if object has any subscriptions for named event.
Parameters:
- name String
- The name of the event
Returns:
- Boolean
- does the object have a subscription for event
hasObserverFor
(key)
Boolean
private
Returns true
if the object currently has observers registered for a
particular key. You can use this method to potentially defer performing
an expensive action until someone begins observing a particular property
on the object.
Parameters:
- key String
- Key to check
Returns:
- Boolean
incrementProperty
(keyName, increment)
Number
public
Set the value of a property to the current value plus some amount.
1 2 |
person.incrementProperty('age'); team.incrementProperty('score', 2); |
Parameters:
- keyName String
- The name of the property to increment
- increment Number
- The amount to increment by. Defaults to 1
Returns:
- Number
- The new property value
init
public
An overridable method called when objects are instantiated. By default, does nothing unless it is overridden during class definition.
Example:
1 2 3 4 5 6 7 8 9 10 11 |
App.Person = Ember.Object.extend({ init: function() { alert('Name is ' + this.get('name')); } }); var steve = App.Person.create({ name: "Steve" }); // alerts 'Name is Steve'. |
NOTE: If you do override init
for a framework class like Ember.View
,
be sure to call this._super(...arguments)
in your
init
declaration! If you don't, Ember may not have an opportunity to
do important setup work, and you'll see strange behavior in your
application.
metaForProperty
(key)
private
static
In some cases, you may want to annotate computed properties with additional metadata about how they function or what values they operate on. For example, computed property functions may close over variables that are then no longer available for introspection.
You can pass a hash of these values to a computed property like this:
1 2 3 4 |
person: function() { var personId = this.get('personId'); return App.Person.create({ id: personId }); }.property().meta({ type: App.Person }) |
Once you've done this, you can retrieve the values saved to the computed property from your class like this:
1 |
MyClass.metaForProperty('person');
|
This will return the original hash that was passed to meta()
.
Parameters:
- key String
- property name
nearestChildOf
(klass)
deprecated
private
Return the nearest ancestor whose parent is an instance of
klass
.
Parameters:
- klass Class
- Subclass of Ember.View (or Ember.View itself)
Returns:
- Ember.View
nearestInstanceOf
(klass)
deprecated
private
Return the nearest ancestor that is an instance of the provided class.
Parameters:
- klass Class
- Subclass of Ember.View (or Ember.View itself)
Returns:
- Ember.View
notifyPropertyChange
(keyName)
Ember.Observable
public
Convenience method to call propertyWillChange
and propertyDidChange
in
succession.
Parameters:
- keyName String
- The property key to be notified about.
Returns:
off
(name, target, method)
public
Cancels subscription for given name, target, and method.
Parameters:
Returns:
- this
on
(name, target, method)
public
Subscribes to a named event with given function.
1 2 3 |
person.on('didLoad', function() { // fired once the person has loaded }); |
An optional target can be passed in as the 2nd argument that will be set as the "this" for the callback. This is a good way to give your function access to the object triggering the event. When the target parameter is used the callback becomes the third argument.
Parameters:
Returns:
- this
one
(name, target, method)
public
Subscribes a function to a named event and then cancels the subscription
after the first time the event is triggered. It is good to use one
when
you only care about the first time an event has taken place.
This function takes an optional 2nd argument that will become the "this" value for the callback. If this argument is passed then the 3rd argument becomes the function.
Parameters:
Returns:
- this
propertyDidChange
(keyName)
Ember.Observable
private
Notify the observer system that a property has just changed.
Sometimes you need to change a value directly or indirectly without
actually calling get()
or set()
on it. In this case, you can use this
method and propertyWillChange()
instead. Calling these two methods
together will notify all observers that the property has potentially
changed value.
Note that you must always call propertyWillChange
and propertyDidChange
as a pair. If you do not, it may get the property change groups out of
order and cause notifications to be delivered more often than you would
like.
Parameters:
- keyName String
- The property key that has just changed.
Returns:
propertyWillChange
(keyName)
Ember.Observable
private
Notify the observer system that a property is about to change.
Sometimes you need to change a value directly or indirectly without
actually calling get()
or set()
on it. In this case, you can use this
method and propertyDidChange()
instead. Calling these two methods
together will notify all observers that the property has potentially
changed value.
Note that you must always call propertyWillChange
and propertyDidChange
as a pair. If you do not, it may get the property change groups out of
order and cause notifications to be delivered more often than you would
like.
Parameters:
- keyName String
- The property key that is about to change.
Returns:
removeAllChildren
Ember.View
private
Removes all children from the parentView
.
Returns:
- Ember.View
- receiver
removeObserver
(key, target, method)
public
Remove an observer you have previously registered on this object. Pass
the same key, target, and method you passed to addObserver()
and your
target will no longer receive notifications.
Parameters:
- key String
- The key to observer
- target Object
- The target object to invoke
- method String|Function
- The method to invoke.
renderBlock
(buffer)
private
Called on your view when it should push strings of HTML into a
Ember.RenderBuffer
. Most users will want to override the template
or templateName
properties instead of this method.
By default, Ember.View
will look for a function in the template
property and invoke it with the value of context
. The value of
context
will be the view's controller unless you override it.
Parameters:
- buffer Ember.RenderBuffer
- The render buffer
reopen
public
Augments a constructor's prototype with additional properties and functions:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
MyObject = Ember.Object.extend({ name: 'an object' }); o = MyObject.create(); o.get('name'); // 'an object' MyObject.reopen({ say: function(msg){ console.log(msg); } }) o2 = MyObject.create(); o2.say("hello"); // logs "hello" o.say("goodbye"); // logs "goodbye" |
To add functions and properties to the constructor itself,
see reopenClass
reopenClass
public
Augments a constructor's own properties and functions:
1 2 3 4 5 6 7 8 9 10 |
MyObject = Ember.Object.extend({ name: 'an object' }); MyObject.reopenClass({ canBuild: false }); MyObject.canBuild; // false o = MyObject.create(); |
In other words, this creates static properties and functions for the class. These are only available on the class and not on any instance of that class.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 |
App.Person = Ember.Object.extend({ name : "", sayHello : function() { alert("Hello. My name is " + this.get('name')); } }); App.Person.reopenClass({ species : "Homo sapiens", createPerson: function(newPersonsName){ return App.Person.create({ name:newPersonsName }); } }); var tom = App.Person.create({ name : "Tom Dale" }); var yehuda = App.Person.createPerson("Yehuda Katz"); tom.sayHello(); // "Hello. My name is Tom Dale" yehuda.sayHello(); // "Hello. My name is Yehuda Katz" alert(App.Person.species); // "Homo sapiens" |
Note that species
and createPerson
are not valid on the tom
and yehuda
variables. They are only valid on App.Person
.
To add functions and properties to instances of
a constructor by extending the constructor's prototype
see reopen
send
(actionName, context)
public
Triggers a named action on the ActionHandler
. Any parameters
supplied after the actionName
string will be passed as arguments
to the action target function.
If the ActionHandler
has its target
property set, actions may
bubble to the target
. Bubbling happens when an actionName
can
not be found in the ActionHandler
's actions
hash or if the
action target function returns true
.
Example
1 2 3 4 5 6 7 8 9 10 |
App.WelcomeRoute = Ember.Route.extend({ actions: { playTheme: function() { this.send('playMusic', 'theme.mp3'); }, playMusic: function(track) { // ... } } }); |
Parameters:
- actionName String
- The action to trigger
- context *
- a context to send with the action
set
(keyName, value)
Object
public
Sets the provided key or path to the value.
This method is generally very similar to calling object[key] = value
or
object.key = value
, except that it provides support for computed
properties, the setUnknownProperty()
method and property observers.
Computed Properties
If you try to set a value on a key that has a computed property handler
defined (see the get()
method for an example), then set()
will call
that method, passing both the value and key instead of simply changing
the value itself. This is useful for those times when you need to
implement a property that is composed of one or more member
properties.
Unknown Properties
If you try to set a value on a key that is undefined in the target
object, then the setUnknownProperty()
handler will be called instead. This
gives you an opportunity to implement complex "virtual" properties that
are not predefined on the object. If setUnknownProperty()
returns
undefined, then set()
will simply set the value on the object.
Property Observers
In addition to changing the property, set()
will also register a property
change with the object. Unless you have placed this call inside of a
beginPropertyChanges()
and endPropertyChanges(),
any "local" observers
(i.e. observer methods declared on the same object), will be called
immediately. Any "remote" observers (i.e. observer methods declared on
another object) will be placed in a queue and called at a later time in a
coalesced manner.
Parameters:
- keyName String
- The property to set
- value Object
- The value to set or `null`.
Returns:
- Object
- The passed value
setProperties
(hash)
Object
public
Sets a list of properties at once. These properties are set inside
a single beginPropertyChanges
and endPropertyChanges
batch, so
observers will be buffered.
1 |
record.setProperties({ firstName: 'Charles', lastName: 'Jolley' }); |
Parameters:
- hash Object
- the hash of keys and values to set
Returns:
- Object
- The passed in hash
toString
String
public
Returns a string representation which attempts to provide more information
than Javascript's toString
typically does, in a generic way for all Ember
objects.
1 2 3 |
App.Person = Em.Object.extend()
person = App.Person.create()
person.toString() //=> "<App.Person:ember1024>"
|
If the object's class is not defined on an Ember namespace, it will indicate it is a subclass of the registered superclass:
1 2 3 |
Student = App.Person.extend()
student = Student.create()
student.toString() //=> "<(subclass of App.Person):ember1025>"
|
If the method toStringExtension
is defined, its return value will be
included in the output.
1 2 3 4 5 6 7 |
App.Teacher = App.Person.extend({ toStringExtension: function() { return this.get('fullName'); } }); teacher = App.Teacher.create() teacher.toString(); //=> "<App.Teacher:ember1026:Tom Dale>" |
Returns:
- String
- string representation
toggleProperty
(keyName)
Boolean
public
Set the value of a boolean property to the opposite of its current value.
1 |
starship.toggleProperty('warpDriveEngaged');
|
Parameters:
- keyName String
- The name of the property to toggle
Returns:
- Boolean
- The new property value
trigger
(name)
private
Override the default event firing from Ember.Evented
to
also call methods with the given name.
Parameters:
- name String
willDestroy
public
Override to implement teardown.
actions
Object
public
The collection of functions, keyed by name, available on this
ActionHandler
as action targets.
These functions will be invoked when a matching {{action}}
is triggered
from within a template and the application's current route is this route.
Actions can also be invoked from other parts of your application
via ActionHandler#send
.
The actions
hash will inherit action handlers from
the actions
hash defined on extended parent classes
or mixins rather than just replace the entire hash, e.g.:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
App.CanDisplayBanner = Ember.Mixin.create({ actions: { displayBanner: function(msg) { // ... } } }); App.WelcomeRoute = Ember.Route.extend(App.CanDisplayBanner, { actions: { playMusic: function() { // ... } } }); // `WelcomeRoute`, when active, will be able to respond // to both actions, since the actions hash is merged rather // then replaced when extending mixins / parent classes. this.send('displayBanner'); this.send('playMusic'); |
Within a Controller, Route, View or Component's action handler,
the value of the this
context is the Controller, Route, View or
Component object:
1 2 3 4 5 6 7 8 9 |
App.SongRoute = Ember.Route.extend({ actions: { myAction: function() { this.controllerFor("song"); this.transitionTo("other.route"); ... } } }); |
It is also possible to call this._super(...arguments)
from within an
action handler if it overrides a handler defined on a parent
class or mixin:
Take for example the following routes:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
App.DebugRoute = Ember.Mixin.create({ actions: { debugRouteInformation: function() { console.debug("trololo"); } } }); App.AnnoyingDebugRoute = Ember.Route.extend(App.DebugRoute, { actions: { debugRouteInformation: function() { // also call the debugRouteInformation of mixed in App.DebugRoute this._super(...arguments); // show additional annoyance window.alert(...); } } }); |
Bubbling
By default, an action will stop bubbling once a handler defined
on the actions
hash handles it. To continue bubbling the action,
you must return true
from the handler:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 |
App.Router.map(function() { this.route("album", function() { this.route("song"); }); }); App.AlbumRoute = Ember.Route.extend({ actions: { startPlaying: function() { } } }); App.AlbumSongRoute = Ember.Route.extend({ actions: { startPlaying: function() { // ... if (actionShouldAlsoBeTriggeredOnParentRoute) { return true; } } } }); |
Default: null
ariaRole
String
public
The WAI-ARIA role of the control represented by this view. For example, a button may have a role of type 'button', or a pane may have a role of type 'alertdialog'. This property is used by assistive software to help visually challenged users navigate rich web applications.
The full list of valid WAI-ARIA roles is available at: http://www.w3.org/TR/wai-aria/roles#roles_categorization
Default: null
classNameBindings
Array
public
A list of properties of the view to apply as class names. If the property is a string value, the value of that string will be applied as a class name.
1 2 3 4 5 |
// Applies the 'high' class to the view element Ember.View.extend({ classNameBindings: ['priority'], priority: 'high' }); |
If the value of the property is a Boolean, the name of that property is added as a dasherized class name.
1 2 3 4 5 |
// Applies the 'is-urgent' class to the view element Ember.View.extend({ classNameBindings: ['isUrgent'], isUrgent: true }); |
If you would prefer to use a custom value instead of the dasherized property name, you can pass a binding like this:
1 2 3 4 5 |
// Applies the 'urgent' class to the view element Ember.View.extend({ classNameBindings: ['isUrgent:urgent'], isUrgent: true }); |
This list of properties is inherited from the view's superclasses as well.
Default: []
classNames
Array
public
Standard CSS class names to apply to the view's outer element. This property automatically inherits any class names defined by the view's superclasses as well.
Default: ['ember-view']
concatenatedProperties
Array
public
Defines the properties that will be concatenated from the superclass (instead of overridden).
By default, when you extend an Ember class a property defined in
the subclass overrides a property with the same name that is defined
in the superclass. However, there are some cases where it is preferable
to build up a property's value by combining the superclass' property
value with the subclass' value. An example of this in use within Ember
is the classNames
property of Ember.View
.
Here is some sample code showing the difference between a concatenated property and a normal one:
1 2 3 4 5 6 7 8 9 10 11 12 13 |
App.BarView = Ember.View.extend({ someNonConcatenatedProperty: ['bar'], classNames: ['bar'] }); App.FooBarView = App.BarView.extend({ someNonConcatenatedProperty: ['foo'], classNames: ['foo'] }); var fooBarView = App.FooBarView.create(); fooBarView.get('someNonConcatenatedProperty'); // ['foo'] fooBarView.get('classNames'); // ['ember-view', 'bar', 'foo'] |
This behavior extends to object creation as well. Continuing the above example:
1 2 3 4 5 6 |
var view = App.FooBarView.create({ someNonConcatenatedProperty: ['baz'], classNames: ['baz'] }) view.get('someNonConcatenatedProperty'); // ['baz'] view.get('classNames'); // ['ember-view', 'bar', 'foo', 'baz'] |
Adding a single property that is not an array will just add it in the array:
1 2 3 4 |
var view = App.FooBarView.create({ classNames: 'baz' }) view.get('classNames'); // ['ember-view', 'bar', 'foo', 'baz'] |
Using the concatenatedProperties
property, we can tell Ember to mix the
content of the properties.
In Ember.View
the classNameBindings
and attributeBindings
properties
are also concatenated, in addition to classNames
.
This feature is available for you to use throughout the Ember object model, although typical app developers are likely to use it infrequently. Since it changes expectations about behavior of properties, you should properly document its usage in each individual concatenated property (to not mislead your users to think they can override the property in a subclass).
Default: null
isDestroyed
public
Destroyed object property flag.
if this property is true
the observers and bindings were already
removed by the effect of calling the destroy()
method.
Default: false
isDestroying
public
Destruction scheduled flag. The destroy()
method has been called.
The object stays intact until the end of the run loop at which point
the isDestroyed
flag is set.
Default: false
isVisible
Boolean
public
If false
, the view will appear hidden in DOM.
Default: null
mergedProperties
Array
public
Defines the properties that will be merged from the superclass (instead of overridden).
By default, when you extend an Ember class a property defined in
the subclass overrides a property with the same name that is defined
in the superclass. However, there are some cases where it is preferable
to build up a property's value by merging the superclass property value
with the subclass property's value. An example of this in use within Ember
is the queryParams
property of routes.
Here is some sample code showing the difference between a merged property and a normal one:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 |
App.BarRoute = Ember.Route.extend({ someNonMergedProperty: { nonMerged: 'superclass value of nonMerged' }, queryParams: { page: {replace: false}, limit: {replace: true} } }); App.FooBarRoute = App.BarRoute.extend({ someNonMergedProperty: { completelyNonMerged: 'subclass value of nonMerged' }, queryParams: { limit: {replace: false} } }); var fooBarRoute = App.FooBarRoute.create(); fooBarRoute.get('someNonMergedProperty'); // => { completelyNonMerged: 'subclass value of nonMerged' } // // Note the entire object, including the nonMerged property of // the superclass object, has been replaced fooBarRoute.get('queryParams'); // => { // page: {replace: false}, // limit: {replace: false} // } // // Note the page remains from the superclass, and the // `limit` property's value of `false` has been merged from // the subclass. |
This behavior is not available during object create
calls. It is only
available at extend
time.
This feature is available for you to use throughout the Ember object model, although typical app developers are likely to use it infrequently. Since it changes expectations about behavior of properties, you should properly document its usage in each individual merged property (to not mislead your users to think they can override the property in a subclass).
Default: null
parentView
Ember.View
private
If the view is currently inserted into the DOM of a parent view, this property will point to the parent of the view.
Default: null
views
Object
private
static
Global views hash