index.html 5.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125
  1. <div php-extends="base"></div>
  2. <div php-block="main" class="container">
  3. <div class="jumbotron">
  4. <h1>Hello Think Angular</h1>
  5. <p>
  6. 此模板引擎针对能够使用angularjs的 php开发者 或 前端开发者 编写, 主要特点是, 不需要额外的标签定义, 全部使用属性定义, 写好的模板文件后, 在开发工具中无需插件即可格式化为很整洁的代码, 因为套完的模板文件还是规范的html.
  7. </p>
  8. <p>
  9. 注: 一个标签上可以使用多个模板属性, 属性有前后顺序要求, 所以要注意属性的顺序, 在单标签上使用模板属性时一定要使用<code>/></code>结束,
  10. <br>
  11. 如:
  12. <br>
  13. <code><input php-literal="code" php-if="$is_download" type="button" value="下载" /></code>
  14. <br>
  15. <code><img php-literal="code" php-if="$article['pic']" src="{&dollar;article.pic}" /></code>
  16. <br>
  17. 具体可参考后面的解析结果.
  18. </p>
  19. <p>
  20. Github项目地址:
  21. <a target="_blank" href="https://github.com/top-think/think-angular">https://github.com/top-think/think-angular</a>
  22. </p>
  23. <p>
  24. <a class="btn btn-primary btn-lg" target="_blank" href="https://github.com/top-think/think-angular">Git版本库地址</a>
  25. <a class="btn btn-primary btn-lg" target="_blank" href="http://kancloud.cn/shuai/php-angular" />在线文档</a>
  26. </p>
  27. </div>
  28. <div class="row">
  29. <div class="col-md-8">
  30. <h4>表格和分页实例</h4>
  31. <table class="table table-bordered">
  32. <tr>
  33. <th>编号</th>
  34. <th>用户名</th>
  35. <th>邮箱</th>
  36. <th>状态</th>
  37. <th>操作</th>
  38. </tr>
  39. <tr php-if="$list" php-repeat="$list as $user">
  40. <td>{$user.id}</td>
  41. <td>{$user.name}</td>
  42. <td>{$user.email}</td>
  43. <td>
  44. <div php-switch="$user['status']">
  45. <span php-case="1">正常</span>
  46. <span php-case="0">已禁用</span>
  47. <span php-case="-1">已删除</span>
  48. </div>
  49. </td>
  50. <td>
  51. <a php-show="$user['status'] === 1" php-after="echo ' '" href="javascript:void(0);" class="btn btn-xs btn-warning">禁用</a>
  52. <a php-show="$user['status'] === 0" php-after="echo ' '" href="javascript:void(0);" class="btn btn-xs btn-primary">启用</a>
  53. <a php-show="$user['status'] >= 0" php-after="echo ' '" href="javascript:void(0);" class="btn btn-xs btn-danger">删除</a>
  54. <a php-show="$user['status'] == -1" php-after="echo ' '" href="javascript:void(0);" class="btn btn-xs btn-primary">恢复</a>
  55. </td>
  56. </tr>
  57. <tr php-else="不存在list的时候, 输出没有数据">
  58. <td colspan="3" class="text-center">没有数据</td>
  59. </tr>
  60. </table>
  61. <nav php-include="page"></nav>
  62. <h2>自动选中: php-selected</h2>
  63. <select class="form-control" php-init="$p = isset($_GET['p']) ? $_GET['p'] : 1">
  64. <option php-for="$i = 1; $i <= 50; $i++" php-selected="$p == $i" value="{$i}">第{$i}页</option>
  65. </select>
  66. <h2>自动勾选: php-checked </h2>
  67. <div
  68. class="form-control"
  69. php-init="$all_hobby = ['html','css','js','php', 'mysql', 'linux']"
  70. php-init="$user_hobby = ['linux','css','js','php']">
  71. 技能:
  72. <label class="checkbox-inline" php-repeat="$all_hobby as $hobby">
  73. <input
  74. type="checkbox"
  75. name="hobby"
  76. value="{$hobby}"
  77. php-checked="in_array($hobby, $user_hobby)" /> {$hobby}
  78. </label>
  79. </div>
  80. <br />
  81. <div class="form-control" php-init="$user_sex = 1">
  82. 性别:
  83. <label class="radio-inline">
  84. <input type="radio" name="sex" value="0" php-checked="$user_sex === 0" /> 女
  85. </label>
  86. <label class="radio-inline">
  87. <input type="radio" name="sex" value="1" php-checked="$user_sex === 1" /> 男
  88. </label>
  89. </div>
  90. <h2>自定义解析规则</h2>
  91. <div php-dump="$navs"></div>
  92. <div php-init="$i = 0" php-inc="$i" php-inc="$i">{$i}</div>
  93. <div php-dec="$i">{$i}</div>
  94. <h2>原样输出</h2>
  95. <div php-literal="">{$title}</div>
  96. <div php-literal="code">{$title}</div>
  97. <br />
  98. <php php-literal="code">{title} {$content}</php>
  99. <h2>input数据绑定,自动转义特殊字符</h2>
  100. <div>
  101. <form action="?" method="post">
  102. <input type="text" name="name" php-model="$name" />
  103. <input type="submit" value="提交">
  104. </form>
  105. </div>
  106. <p><br /></p>
  107. </div>
  108. <div class="col-md-4">
  109. <h4>无限级菜单输出</h4>
  110. <ul php-init="echo_menu($menus)" php-function="echo_menu($menus)">
  111. <li php-repeat="$menus as $menu">
  112. {$menu.title}
  113. <ul php-if="isset($menu['sub'])" php-call="echo_menu($menu['sub'])"></ul>
  114. </li>
  115. </ul>
  116. </div>
  117. </div>
  118. </div>