nested_controllers.html 1.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title>Nested Controllers</title>
  5. <style type="text/css">
  6. div {
  7. padding-left: 10px;
  8. }
  9. </style>
  10. <script src="../dist/seed.js"></script>
  11. </head>
  12. <body>
  13. <div sd-controller="Grandpa">
  14. <p sd-text="name"></p>
  15. <div sd-controller="Dad">
  16. <p><span sd-text="name"></span>, son of <span sd-text="^name"></span></p>
  17. <div sd-controller="Son">
  18. <p><span sd-text="name"></span>,son of <span sd-text="^name"></span></p>
  19. <div sd-controller="Baby">
  20. <p>
  21. <span sd-text="name"></span>,
  22. son of <span sd-text="^name"></span>,
  23. grandson of <span sd-text="^^name"></span>
  24. and great-grandson of <span sd-text="$name"></span>
  25. </p>
  26. </div>
  27. </div>
  28. </div>
  29. </div>
  30. <script>
  31. Seed.controller('Grandpa', function (scope, seed) {
  32. scope.name = 'John'
  33. })
  34. Seed.controller('Dad', function (scope, seed) {
  35. scope.name = 'Jack'
  36. })
  37. Seed.controller('Son', function (scope, seed) {
  38. scope.name = 'Jason'
  39. })
  40. Seed.controller('Baby', function (scope, seed) {
  41. scope.name = 'James'
  42. })
  43. Seed.bootstrap()
  44. </script>
  45. </body>
  46. </html>