htmlbars

问题 I have a set of buttons whose state I wish to toggle with a class active . If I had a single button, then I would bind the active class to a controller property and toggle that property in the click handler: <button {{action 'toggle'}} class="{{active}}">model.title</button> actions: { toggle: function() { this.set('active', true); } } But I have multiple buttons, so I am not sure what I can bind. It would be useful if I could pass a reference to the clicked button to the action handler, but

问题 I have created a CMS where it is be possible to use HTMLbars to create templates. The templates should be compiled client side and there is component that should display the template. I'm setting the template property of the component to a function that returns the compiled template using HTMLBars. import Ember from 'ember'; export default Ember.Component.extend({ content: null, template: function () { return Ember.HTMLBars.compile(this.get('content.template')); } } I've included the ember

问题 I'm migrating an Ember 1.5 Handlebars app to current stable Ember and HTMLBars and it seems that a bound controller property must return "disabled" or null to work as expected with "disabled" DOM attributes. <button disabled={{isDisabled}}> In Handlebars isDisabled property is a boolean and all is well. In HTMLBars it seems I need: Ember.Controller.extend({ isDisabled: function() { if(this.get('itemSelected')){ return null; } else { return 'disabled'; } }.property('itemSelected') }); Is this

问题 I'm migrating an Ember 1.5 Handlebars app to current stable Ember and HTMLBars and it seems that a bound controller property must return "disabled" or null to work as expected with "disabled" DOM attributes. <button disabled={{isDisabled}}> In Handlebars isDisabled property is a boolean and all is well. In HTMLBars it seems I need: Ember.Controller.extend({ isDisabled: function() { if(this.get('itemSelected')){ return null; } else { return 'disabled'; } }.property('itemSelected') }); Is this

问题 I am fairly new to Ember (using version 0.2.3). I have a component with a few computed values. They gather these computed values from input fields: export default Component.extend({ loanAmount : 200000, deductible : 0, debtInt : 5, getLoanCosts: computed('loanAmount', 'debtInt', function(){ return (get(this, 'debtInt')/12) * get(this, 'loanAmount'); }) On my template.hbs, I have an input field {{ input value=loanAmount }} and I can call {{getLoanCosts}} in my template.hbs, to show the

问题 I'm trying to write a component integration test, a la this blog post, but my component has a link-to to a dynamic route and the href property isn't being filled in. Here is a simplified version of what I'm trying to do. My component's template: {{#link-to "myModel" model}} And here is the relevant part of my test: this.set('model', { id: 'myId', name: 'My Name' }); this.render(hbs` {{my-component model=model}} `); assert.equal(this.$('a').attr('href'), '/myModel/myId'); // fails The link-to

问题 I want to iterate and render some text in my Ember Handlebars template I have a JSON as below; (comes within item) "reas":{"Display Text 1":[null],"Display Text 2":[null]} I want to display the text (Display Text 1/Display Text 2) on UI i.e. keys of my object. So in my Ember Handlebars template, I do {{#each item in item.reas}} <tr> <td>{{item}}</td> </tr> {{/each}} Earlier I had also tried the {{@key} But I am unable to get the text. What am I doing wrong ? PS: Please remember that this is

问题 I'm trying to bind a static class 'form-control' and a dynamic property value 'color' to the class attribute of an input helper, however, the syntax I'm using just outputs this to the rendered DOM element class="form-control {{color}}" without actually binding the value of 'color' to the class attribute. I know that this is the way to bind static and dynamic classes in normal DOM elements with HTMLBars, but is there a different syntax for elements that use curly-braces? The syntax I'm using:

问题 I would like to display an error message when the server responses with record not found. The model in the route handler: model: function(userLoginToken) { var userLoginToken= this.store.createRecord('userLoginToken'); return userLoginToken; }, The action: actions: { sendOTP: function(userLoginToken) { var thisObject = this; var model=this.currentModel; this.store.findRecord('user-login-token', userLoginToken.get('mobileNumber')).then(function(response) { //thisObject.get('controller').set(

问题 I've got a few text-input helper like this {{input type="text" valueBinding="name" focus-out="focusOutName"}} I just upgraded Ember to 1.11.0 and now get this deprecation warning: DEPRECATION: You're attempting to render a view by passing valueBinding to a view helper, but this syntax is deprecated. You should use value=someValue instead. However when using value it is not bound in the controller and value simply sets the text to whatever value. How do I correctly bind it? 回答1: You should