Multiple use of a template in the same page in AngularJS

Amit

I have some repetitive components on my AngularJS page such as billingAddress, shippingAddress and primaryAddress. I have created a separate template file for address components and expected to be able to use ng-include to include the template thrice on my page. I am unable to find documentation around passing models to templates. What I am looking for is something like

<div ng-include="address.tpl.html" ng-model="{address: primaryAddress}"></div>
<div ng-include="address.tpl.html" ng-model="{address: billingAddress}"></div>
<div ng-include="address.tpl.html" ng-model="{address: shippingAddress}"></div>

Is this even possible as of now?

1st4ck

his is for what directives are made.

angular.module('docsSimpleDirective', [])
  .directive('myAddress', function() {
    return {
      scope: {
          address : '='
      },
      templateUrl: 'address.tpl.html'
    };
  });

Then in your template simple use the $scope.address. On declaring the directive you should use it like this.

<my-address address="primaryAddress"><my-address>
<my-address address="billingAddress"><my-address>
<my-address address="shippingAddress"><my-address>

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at
0

Comments

0 comments
Login to comment

Related

From Dev

How can I use input textbox value in the ng-template script tag of same angularjs page

From Dev

How can I use input textbox value in the ng-template script tag of same angularjs page

From Dev

Using multiple views in the same page using AngularJS

From Dev

Laravel/Blade - Extend same template multiple times on same page

From Dev

Page based interface use multiple of the same viewcontrollers

From Dev

AngularJS multiple controllers on the same page - Only the first one works

From Dev

How to use same Code base for multiple AngularJS projects

From Java

Can I use multiple versions of jQuery on the same page?

From Dev

Can I use multiple managed bean in the same xhtml page?

From Dev

Is there a way to use the same jQuery Ajax for multiple items on a single page?

From Dev

How To Use An Angular Controller Multiple Times On The Same Page?

From Dev

How to use WebUserControl multiple times on same web page

From Dev

How to use bootstrap modal on multiple images on same page on image click?

From Dev

How to use same onclick function multiple times in php page?

From Dev

should I use different nonces for multiple forms on same page?

From Dev

How to use same onclick function multiple times in php page?

From Dev

Is it possible to use multiple <ons-speed-dial> in a same page?

From Dev

AngularJS template reload and page disappears

From Dev

Angularjs multiple index page

From Dev

Multiple Slickgrid on the same page

From Dev

Multiple Templates on same page

From Dev

multiple carousels on same page

From Dev

Multiple Templates on same page

From Dev

HTML page template for multiple pages

From Dev

Multiple functions using the same template?

From Dev

Multiple CSS style for the same template

From Dev

Multiple functions using the same template?

From Dev

How can I use the same React app in multiple locations of the same page?

From Dev

In AngularJS, the use of $ in a filter, inside a template

Related Related

  1. 1

    How can I use input textbox value in the ng-template script tag of same angularjs page

  2. 2

    How can I use input textbox value in the ng-template script tag of same angularjs page

  3. 3

    Using multiple views in the same page using AngularJS

  4. 4

    Laravel/Blade - Extend same template multiple times on same page

  5. 5

    Page based interface use multiple of the same viewcontrollers

  6. 6

    AngularJS multiple controllers on the same page - Only the first one works

  7. 7

    How to use same Code base for multiple AngularJS projects

  8. 8

    Can I use multiple versions of jQuery on the same page?

  9. 9

    Can I use multiple managed bean in the same xhtml page?

  10. 10

    Is there a way to use the same jQuery Ajax for multiple items on a single page?

  11. 11

    How To Use An Angular Controller Multiple Times On The Same Page?

  12. 12

    How to use WebUserControl multiple times on same web page

  13. 13

    How to use bootstrap modal on multiple images on same page on image click?

  14. 14

    How to use same onclick function multiple times in php page?

  15. 15

    should I use different nonces for multiple forms on same page?

  16. 16

    How to use same onclick function multiple times in php page?

  17. 17

    Is it possible to use multiple <ons-speed-dial> in a same page?

  18. 18

    AngularJS template reload and page disappears

  19. 19

    Angularjs multiple index page

  20. 20

    Multiple Slickgrid on the same page

  21. 21

    Multiple Templates on same page

  22. 22

    multiple carousels on same page

  23. 23

    Multiple Templates on same page

  24. 24

    HTML page template for multiple pages

  25. 25

    Multiple functions using the same template?

  26. 26

    Multiple CSS style for the same template

  27. 27

    Multiple functions using the same template?

  28. 28

    How can I use the same React app in multiple locations of the same page?

  29. 29

    In AngularJS, the use of $ in a filter, inside a template

HotTag

Archive