Quantcast
Channel: Ember.JS - Latest topics
Viewing all 4838 articles
Browse latest View live
↧

Best way to replace Mixins

January 2, 2020, 7:24 pm
$
0
0

@JonForest wrote:

We have a lot of existing code that makes heavy use of mixins - these provide 100s of actions and lifecycle hook functions for controllers, components and routes. Some of these mixins are many 100s of lines long, and some mixins include mixins.

I’d love to replace them as we move to a more Ember Octane view of the world, but I’m not sure what the best / canonical / recommended approach is?

In the past I’ve recommended moving everything into a service, importing into the the original route/controller/component and have the stub action/lifecycle hook immediately call the function on the service. It works because the explicitness of where the function is declared is obvious, but given the amount of places the mixins are used, and the size of them, this is still quite a lot of work and duplication.

We could inherit instead, but I’m not sure this makes for a much better world.

Or we could kick the can down the road given that classic Ember syntax is still supported for the foreseeable future. I actually expect that this will be part of any solution we adopt.

Suggestions welcome - thank you.

Posts: 1

Participants: 1

Read full topic

↧
Search

Can addons use template-only components?

January 8, 2020, 3:37 am
$
0
0

@jelhan wrote:

Came across another question related to Octane and addons: Assuming the addon only supports ember >= 3.15 could it use template-only components without requiring template-only-glimmer-components feature to be enabled on consuming application?

Or should it add an empty glimmer component to prevent a wrapper div if that optional feature is disabled? If so: Does this have any performance impact?

And assuming that’s the case: Did someone already wrote an addon that adds the boilerplate classes at build-time only if needed?

Posts: 2

Participants: 1

Read full topic

↧
↧

Optimal way to pull API data without the store

January 9, 2020, 2:34 pm
$
0
0

@Justin_Proctor wrote:

We have many situations were we are pulling in a very large amount of data (like for a HeatMap) or data that we do not want to cache in the store. We have implemented a large number of solutions over the years but we have not found a good one that affords us a sense of ease. We are missing out on the error handling that a store call has as well as the concise amount of code. What we are looking for the proper way to use calls like $.getJSON that is reusable and something contained.

Here is an example of a version that we have. We do not like that we need to use a property on the component to mark the promise as having errored.

weather: computed('refreshDataTrigger', function()
{
  const that = this;

  let promise = new Promise(function(resolve, reject)
  {
    resolve($.getJSON(`/api/weatherForecasts/current`));
    reject();
  });

  let promiseObject = DS.PromiseObject.create(
  {
    promise: promise
  });

  promiseObject.then(function(value)
  {
    that.set('isErrorState', false);
    return value;
  }, function(reason)
  {
    that.set('isErrorState', true);
    Log.Log(reason);
    return null;
  });

  return promiseObject;
}),

We wanted to use this with a promise addon to handle the status of the promise like we do with normal store calls.

{{#if (is-fulfilled weather)}} {{#if (is-pending weather)}} {{#if (is-rejected weather)}}

Could we get some guidance?

Posts: 2

Participants: 2

Read full topic

↧

How to "refresh" the router from child component In Octane

January 9, 2020, 9:05 pm
$
0
0

@Murali wrote:

In the new Octane version, How do we refer to the current router from the child component.

**Router**
export default class SomeRouter extends Route {    
    model() {
        return data;        
    }
    @action
    refreshRoute() {
        this.refresh();
    }
}

**SomerRouter.hbs** 
<ChildComponent  >

**ChildComponent**
export default class ChildComponent extends Component { 
    @action
    revert() {
       //How do I invoke the "refreshRoute" on the SomeRouter from here.
    }
}

Posts: 1

Participants: 1

Read full topic

↧

Ember.js - The Ember Times - Issue No. 130

January 10, 2020, 5:06 pm
↧
↧

Abort transition in willTransition and Browser Back button

January 13, 2020, 12:30 am
$
0
0

@Myrdhin wrote:

Hello everybody :smiley:

I noticed a strange behavior in Ember … I’m trying to cancel a transition in the willTransition hook. For example, I’m on “page2” and I’m from “page1”. When I click on the link “page1”, no problem: the transition is canceled and the url doesn’t change. On the other hand, when I use the back button of the browser, the url changes first (I see the url of page1 in the bar) then the transition is canceled. The problem: I’m still on page2 but I now have the url of page1 !!! Is this a bug?

My route2.js code to simulate this behavior (here I use confirm but in my prod code I use bootbox):

import Route from '@ember/routing/route';

export default Route.extend({
  actions: {
    willTransition(transition) {
      if (!transition.data.force) {
        transition.abort();
        const r = confirm("Do you want to cancel transition?");

        if (r === false) {
          transition.data.force = true;
          transition.retry();
        }
      }
    }
  }
});

Thanks for your help,

Posts: 1

Participants: 1

Read full topic

↧

Describing the community category: for taxonmy nerds like myself

January 13, 2020, 7:07 am
$
0
0

@efx wrote:

How should we describe the community category? I stole the first description from https://users.rust-lang.org/categories.

  • This category is a place to talk about anything related to Ember.js community.
  • Use this category to highlight members of our community or invite others to an event.

0 voters

Posts: 1

Participants: 1

Read full topic

↧

How to pass an action from template controller to Grand child component

January 13, 2020, 8:01 pm
$
0
0

@Murali wrote:

I am quiet new Ember frame work. I am trying to pass an “action” from the controller to the grandchild component of the current template. But it fails for some reason. Could anyone let me know what am I missing here.

MainTemplate's Router Controller

export default class MainTemplateController extends Controller {

      field = "userId";

      @action
      save () {
        //save data
      }

}

MainTemplate.hbs
<ChildComponent @field={{this.field}} @save={{this.save}} /> 


ChildComponent.hbs 
<GrandChildComponent @field={{this.field}} @save={{this.save}} />


GrandChildComponent.hbs
<button @onClick={{action "doSomething" (readonly @field)}}>Save</button>

export default class GrandChildComponent extends Component {    
    @action
    doSomething(fieldName) {
        console.log(fieldName); // logs as "userId"
        console.log(this.args.save) // undefined
    }    
}

Posts: 1

Participants: 1

Read full topic

↧
Search

How to use new version ember addon with old version ember app?

January 14, 2020, 1:45 am
↧
↧

Differences between Ember app, addon and child engine

January 14, 2020, 7:43 pm
$
0
0

@harimath wrote:

We can have different types of Ember projects

  1. App (or host app)
  2. Addon
  3. Engine (or child engine)

I wanted to understand the differences between each of them in terms of;

  1. Criteria to decide which one to use (or simply the use cases for each of them)
  2. What is the difference in terms of their output (i.e. How the dist looks for each of them, vendor.js V/S engine.js, etc)

Any other significant difference which you would want to highlight would be really helpful.

Posts: 1

Participants: 1

Read full topic

↧

Equivalent RouteInfo objects aren't agreeing with each other

January 16, 2020, 12:35 pm
$
0
0

@samselikoff wrote:

I’m noticing that these two are not equivalent:

this.router.currentRoute.parent
this.router.currentRoute.parent.parent.child

In particular they have different .attributes properties (one has the model, one doesn’t).

Is this intentional?

I’m on 3.10.

Posts: 2

Participants: 2

Read full topic

↧

Ember.js - The Ember Times - Issue No. 131

January 17, 2020, 12:05 pm
↧

How to add a child component to the main component through javascript in Ember Octane

January 19, 2020, 7:20 pm
$
0
0

@Murali wrote:

Hi,

I have main component with a button. Whenever this button is clicked I want to instantiate and add a child component to a “div” in the main component . It’s like adding rows on button click. How do I implement this behavior.

Here is the pseudo code.

MainCompoent.hbs

<div id="placeHolder>   </div>
<button onClick={{this.clickAdd}}> Add </button>


MainCompoent.js
 @action
 clickAdd() {
   //How to initialize Row Component and add to the placeHolder
   // For example document.getElementById("placeHolder").innerHTML += `<RowComponent/>`;
}

RowComponent.hbs
  <div>    
    <input name>  
    <input age>   
 </div>

r1

Posts: 1

Participants: 1

Read full topic

↧
↧

TypeError: (0 , _emberQunit.start) is not a function

January 21, 2020, 1:38 pm
$
0
0

@liamhjmcdermott wrote:

Trying to create and run acceptance tests, app uses ember-simple-auth so I need to use ember-qunit. Using the tests route, there is a global error TypeError: (0 , _emberQunit.start) is not a function. I assume this is referring to the start() function " import { start } from ‘ember-qunit’; " in test-helper.js. I’ve tried reinstalling ember-qunit, installing/reinstalling ember-cli-qunit and I’m at a loss. Ember 2.13, ember-qunit 4.6

Posts: 1

Participants: 1

Read full topic

↧

Missing /assets/ember.map

January 23, 2020, 7:01 am
$
0
0

@francesconovy wrote:

It’s not really a big issue, so I figured I’d just ask this here instead of creating an issue on ember-cli. My ember-cli-build.js looks like this:

let isProductionLikeBuild = !['development', 'test'].includes(env);
// ...
sourcemaps: {
  enabled: isProductionLikeBuild
},
'ember-cli-uglify': {
  enabled: isProductionLikeBuild
},

So source maps are disabled in development environment. However, I constantly get the warning in my console that it can’t find the file /assets/ember.map. It’s not really a problem, just a bit annoying that this always messes up the console a bit. I’m on the latest ember-cli & ember-source, and not quite sure why that is happening. Does anybody have an idea how to get rid of this warning?

Source map error: Error: request failed with status 404
Resource URL: http://localhost:4200/assets/vendor.js
Source Map URL: ember.map

Posts: 1

Participants: 1

Read full topic

↧
Search

Issues with Ember/Rails

January 23, 2020, 11:04 am
$
0
0

@evan wrote:

Hey everyone! I’m new to Ember and I’ve enjoyed learning from the tutorial/guides from the main emberjs.com

However, when it comes to trying to connect Rails and Ember, I’ve never seemed to figure out the way how. I’ve tried several resources and to no avail.

I’m not sure if it could be due to the ember version, the syntax from the tutorials looked different from what the generators created.

I’m using Rails 6 and when I type ember -v I get these results:

ember-cli: 3.15.1 node: 10.13.0 os: darwin x64

Any tips would be greatly appreciated, and if you need more info - such as my code in both the Rails/Ember side - I’d be more than glad to share that

Thanks!

Posts: 9

Participants: 2

Read full topic

↧

Ember-derequire/broccoli-derequire/derequire

January 24, 2020, 5:38 am
$
0
0

@shofmannka wrote:

I am using ember-derequire to replace each occurence of ‘define’ and ‘require’ in the compiled js files (app.js, vendor.js). This works fine, but if i build the test environment in the generated tests.js no replacement of ‘define’ and ‘require’ is performed. Has anybody a idea why?

Posts: 1

Participants: 1

Read full topic

↧
↧

Ember.js - The Ember Times - Issue No. 132

January 24, 2020, 3:22 pm
↧

Possible to know adapter query url inside serializer?

January 27, 2020, 8:51 am
$
0
0

@aepavlick wrote:

I have a serializer which needs to know about certain query parameters from the adapters urlForQueryRecord string. But I’m unsure of how to go about making this information accessible to the serializer responsible for its request.

Originally I was accessing this information via the store thats passed into normalizeResponse() but that poses certain problems of its own. I thought about using extractMeta/Attributes, etc. Bot those methods seem to focus on pulling data from the payload.

Thoughts?

Posts: 1

Participants: 1

Read full topic

↧

Manipulating ember data in component

January 27, 2020, 10:21 am
$
0
0

@Tiago_Costa wrote:

Hi everyone!

I’m learning ember (v3.15) and I’ve been batling with an issue for the last couple of days that I can’t solve . My problem is sorting a list of ember data records inside a component.

I’m trying to build a calendar component (a simple table) that displays my vacations for the entire year. To do this, I use ember-data to retrieve the list of dates (each record has a startDate and endDate) with my vacations in the routes model(): route

The list of dates is passed to the component like so (the argument is @vacationsList):

<Vacations::VacationsEditor @count={{this.model.count}} @vacationsList={{@model.dates}} @addNewVacationDate={{this.addNewVacationDate}} @updateCounter={{this.updateCount}} />

So far so go. I can display the list inside my component using {{@vacationsList}}.

The issue comes when I try to modify the records list. To generate the table, I need to sort the records by the startDate property (among other things) and I can’t find a way to do this that works.

I created a computed property to iterate over the records and return something that the component can use but the console.log() statement is never executed. I assume this is because I’m working with a promise?

@computed

get months(){
    this.args.vacationsList.forEach(x => {console.log(x);});
    let months = [];
    return months;
}

Another thing I’ve tried was using the @sort() computed property in the routes controller. This works in the sense that it sorts the list but once I’m inside the computed property I can’t iterate the this.args.vacationsList array (@sort() returns a MutableArray if I’m not mistaken) because it’s always empty.

What am I doing wrong?

Posts: 3

Participants: 2

Read full topic

↧
Viewing all 4838 articles
Browse latest View live
Search