CODEWITHSUNDEEP
javascriptaurelia
epitka
epitka

Reputation: 17637

reference a property on a custom attribute

How does one deal with situation where I have a custom attribute, lets say it is a pager, where I have properties totalItems,currentPage, and itemsPerPage among others. There is a computed property called numberOfPages as well. How do you "share" this property numberOfPages outside of custom attribute. In angular, you would set it on the $scope. How does one do it in aurelia?

Upvotes: 2

Views: 362

Answers (1)

Matthew James Davis
Matthew James Davis

Reputation: 12295

Use attribute-name.ref

<div pager="..." pager.ref="pager">
  <span>${pager.numberOfPages} pages</span>
</div>

ref

Creates a reference to an HTML element, a component or a component's parts.

  • ref="someIdentifier" or element.ref="someIdentifier" - Create a reference to the HTMLElement in the DOM.
  • attribute-name.ref="someIdentifier"- Create a reference to a custom attribute's view-model.
  • view-model.ref="someIdentifier"- Create a reference to a custom element's view-model.
  • view.ref="someIdentifier"- Create a reference to a custom element's view instance (not an HTML Element).
  • controller.ref="someIdentifier"- Create a reference to a custom element's controller instance.

-- aurelia docs

Working Gist here: https://gist.run/?id=0b60a1687e213797a8adc0d5ca870c06

Edit: If you're actually building a pager, consider creating a custom element with a template part. You'll have a much easier time.

Upvotes: 2

Related Questions