i have setup modals, , using liquid-teather.
i have 2 different modals on page - summer-recipe.hbs: 1 x salads modal 1 x smoothies modal
both work.
as both modals on, , open summer-recipe.hbs page. route file routes/summer-recipes.js
is there way set specific route each modal. i'd able set up/have equivalent to:
routes/salads.js routes/smoothies.js
snippets of code 1 modal below:
summer-recipes.hbs:
{{#if showsaladsdialog}} {{#liquid-tether to="modal-dialog" target="document.body" targetmodifier="visible" attachment="middle center" tetherclass="modal-dialog" overlayclass="modal-backdrop"}} <div class="row"> <div class="col-md-9"> <div class="modal-content"> <div class="modal-header"> <h4 class="modal-title">salads</h4> </div> <div class="modal-body"> <div class="container"> <div class="row"> <div class="col-md-12"> salads content... </div><!-- /.right col --> </div><!-- /.row --> </div><!-- /.container --> </div> <div class="modal-footer"> <button type="button" class="btn btn-close" {{action "closesaladsmodaldialog"}}> close </button> </div> </div> </div> </div> {{/liquid-tether}} {{/if}} controllers/summer-recipes.js:
showsaladsdialog: gte('newuser', 1), actions: { opensaladsmodaldialog() { this.set('edituser', 1); }, closesaladsmodaldialog() { this.set('edituser', 0); } }
you need define url salads in router.js, create route , use model hook in route collect necessary data. since want create , edit salads should create separate routes also.
this.route('salads', function() { this.route('new'); this.route('edit', { path: '/salads/:salad_id' }); }); now in routes them use model hook createrecord(for new route) or findrecord salad_id params(for edit route).
