Giter VIP home page Giter VIP logo

ember-href-to's Introduction

ember-href-to

A lightweight alternative to {{link-to}}. No components, no class bindings - just a bound anchor href and a click handler.

Build Status Ember Observer Score

Why use it?

Every time you use a {{link-to}}, you create a view. This is usually fine, but in cases where you're creating many of these, performance can suffer. {{href-to}} simply creates a URL and is 12x faster than {{link-to}} in Ember 1.13.4.

Questions? Ping me @gavinjoyce

Installation

This is an Ember CLI addon, to install:

ember install ember-href-to

Usage Instructions

{{href-to}} has the same interface as {{link-to}}, you can use it to link to static and dynamic routes in your ember application:

<a href="{{href-to 'index'}}">Go Home</a>
<a href="{{href-to 'contacts.contact' contact}}">View Contact 1</a>
<a href="{{href-to 'contacts.contact' 2}}">View Contact 2</a>
<a href="{{href-to 'contact-us' (query-params section='first')}}">You can also use query params</a>
<a href="{{href-to 'contact-us'}}#first">You can also use fragment identifiers</a>
<a href="{{href-to 'contact-us'}}" data-href-to-ignore>
  If you have a catchall route (this.route('catchall', { path: "/*" })),
  you need to add the attribute "data-href-to-ignore",
  otherwise you will always match it
</a>

As {{href-to}} simply generates a URL, you won't get automatic active class bindings as you do with {{link-to}}. Clicking on a {{href-to}} URL will trigger a full router transition though:

href-to2

Development Instructions

  • git clone this repository
  • npm install
  • bower install

Running

ember-href-to's People

Contributors

gavinjoyce avatar cibernox avatar ilucin avatar abuiles avatar briangonzalez avatar gpoitch avatar jevanlingen avatar m-basov avatar locks avatar rlivsey avatar mazondo avatar samselikoff avatar sduquej avatar teddyzeenny avatar ember-tomster avatar oscarni avatar

Watchers

James Cloos avatar Abram Booth avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.