0

我一直在看这个例子并通过谷歌搜索无济于事。我不明白如何popover-template工作。它是 Angular 的模板系统吗?我找不到任何关于此的文档,所以我想我会求助于社区。我怎样才能类似地创建自己的模板?

<!DOCTYPE html>
<html ng-app="myApp">

 <head>
  <script data-require="angular.js@1.1.5" data-semver="1.1.5" src="http://code.angularjs.org/1.1.5/angular.min.js"></script>
  <script data-require="angular.js@1.1.5" data-semver="1.1.5" src="bootstrap-ui.js"></script>
  <link data-require="bootstrap-css@2.3.2" data-semver="2.3.2" rel="stylesheet" href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css" />
  <link rel="stylesheet" href="style.css" />
  <script src="script.js"></script>
 </head>

 <body ng-controller="Ctrl">
  <div style="padding-bottom: 400px"></div>
  <div class="container-fluid">
   <fieldset>
    <div class="control-group">
     <label class="control-label" for="tc">Sample:</label>
      <div class="controls">
       <div class="input-prepend">
        <input placeholder="Enter end date.." type="text" class="input-small" ng-model="entity.endDate" name="endDate" />
        <button type="button" class="btn" ng-model="$parent.entity.endDate" popover-template="datepicker-test.html">
        <i class="icon-calendar"></i>
      </button>
     </div>
    </div>
   </div>
  </fieldset>
 </div>
</body>
</html>
4

1 回答 1

2

它是来自 angular-ui 的引导子项目的指令:

<button type="button" class="btn" ng-model="$parent.entity.endDate" popover-template="datepicker-test.html">

对应的 Javascript 是 inbootstrap-ui.js:

.directive( 'popoverTemplate', [ '$tooltip', function ( $tooltip ) {
    return $tooltip( 'popoverTemplate', 'popover', 'click' );
}]);

项目在这里:https ://github.com/angular-ui/bootstrap

于 2013-07-16T06:41:56.473 回答