Skip to content

Instantly share code, notes, and snippets.

@mohamedali-s-4725
Last active August 17, 2021 13:57
Show Gist options
  • Save mohamedali-s-4725/5e60450022d8041baa0b03f059b1f98f to your computer and use it in GitHub Desktop.
Save mohamedali-s-4725/5e60450022d8041baa0b03f059b1f98f to your computer and use it in GitHub Desktop.
Array.clear()
import Ember from 'ember';
import { A } from '@ember/array';
import { get, set } from '@ember/object';
export default Ember.Component.extend({
array_prop: A(),
reset_array_by: 'empty_string',
didInsertElement(){
this._super(...arguments);
let self = this;
console.log(get(self, 'array_prop'));
},
actions: {
fillArray(){
let self = this,
array_prop = get(self, 'array_prop');
array_prop.pushObject(get(self, 'array_prop').length);
},
ResetArrayBy(value){
set(this, 'reset_array_by', value);
}
},
willDestroyElement(){
this._super(...arguments);
let self = this,
reset_array_by = get(self, 'reset_array_by');
if (reset_array_by === 'empty_string'){
set(self, 'array_prop', '');
} else if (reset_array_by === 'empty_array'){
set(self, 'array_prop', A());
} else if (reset_array_by === 'ember_clear'){
get(self, 'array_prop').clear();
}
}
});
import Ember from 'ember';
import { A } from '@ember/array';
import { get, set } from '@ember/object';
export default Ember.Controller.extend({
showArrayComponent: false,
actions: {
toggleArrayComponent(){
let self = this;
set(self, 'showArrayComponent', !get(self, 'showArrayComponent'));
}
}
});
<h1> Resetting the Ember.Array </h1>
<br>
<button {{action 'toggleArrayComponent'}}>
{{#if showArrayComponent}} `Destroy` {{else}} `Init` {{/if}} Array Component
</button>
{{#if showArrayComponent}}
{{ember-array}}
{{/if}}
{{outlet}}
<br>
<br>
<br>
<h3> Array Component Initialized </h3>
<br>
<button {{action 'fillArray'}}> Fill Array </button>
<br>
<ul>
{{#each array_prop as | arr_value |}}
<li>Value : {{arr_value}}</li>
<br>
{{/each}}
</ul>
<br><hr>
<h3> Use any of the below to destroy the Array Component : </h3><br>
Reset the array with `Empty string` : <button {{action 'ResetArrayBy' 'empty_string'}}> Click </button> <b> ( Default ) </b><br><br>
Reset the array with new `Ember Array` : <button {{action 'ResetArrayBy' 'empty_array'}}> Click </button><br><br>
Reset the array with new `Ember clear()` : <button {{action 'ResetArrayBy' 'ember_clear'}}> Click </button><br><br>
{
"version": "0.15.1",
"EmberENV": {
"FEATURES": {}
},
"options": {
"use_pods": false,
"enable-testing": false
},
"dependencies": {
"jquery": "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.js",
"ember": "3.4.3",
"ember-template-compiler": "3.4.3",
"ember-testing": "3.4.3"
},
"addons": {
"ember-data": "3.4.2"
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment