0

私はこの例を見ていて、Googleを調べても役に立ちませんでした。仕組みがわかりません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 に答える