Question

我的ui-view之前有一个标题区域。我不想在每个模板文件中包含我的标题。如何使用指令或其他东西来获取页面顶部的按钮？

按钮取决于页面。

这里有一些例子：

我的主要index.html

<!DOCTYPE html>
<html ng-app="smarthome">
 <head>
  <script type="text/javascript" src="/lib/ionic/js/angular/angular.min.js"></script>
  <script type="text/javascript" src="/lib/ionic/js/angular-ui/angular-ui-router.min.js"></script>
  <script type="text/javascript" src="/js/main.js"></script>
 </head>
 <body>
    <section id="content">
        <div class="page-header row">
            <div class="col-sm-4">
                <a href="" ng-show="isBack()" ng-click="goBack()">
                    <i class="ion ion-arrow-left-c"></i>
                </a>
            </div>
            <div class="col-sm-4">
                <h1>blabla</h1>
            </div>
            <div class="col-sm-4">
                <!-- BUTTON HERE -->
            </div>
        </div>
        <div ui-view></div>
    </section>
 </body>
</html>

Answer 1

为什么不将控制器链接到标题并在标题的顶部div中使用ng-show？像这样：

 <body>
    <section id="content" ng-controller="headerCtrl">
        <div class="page-header row" ng-show="isVisible()>
            <div class="col-sm-4">
                <a href="" ng-show="isBack()" ng-click="goBack()">
                    <i class="ion ion-arrow-left-c"></i>
                </a>
            </div>
            <div class="col-sm-4">
                <h1>blabla</h1>
            </div>
            <div class="col-sm-4">
                <!-- BUTTON HERE -->
            </div>
        </div>
        <div ui-view></div>
    </section>
 </body>
</html>

Answer 2

我有类似的要求。您可以通过添加函数

在ng-click中添加按钮功能

angular.module('app', ['LocalStorageModule'])
     .run(['$rootScope', function ($rootScope) {  
               $rootScope.yourFunction = function () {
                   console.log("clicked here");
                }
    }]);

如何在AngularJS中的标题上放置按钮

2 个答案: