Question

我需要创建一个应该在我的应用的每个视图上显示的搜索栏，当我点击导航栏中的搜索图标时，搜索栏应该打开，并且应该打开一个单独的页面以全局搜索项目，我怎样才能做到这一点？请帮助。

这是我的app.js

 .state('login', {
    url: '/',
    templateUrl: 'login/login.html',
    controller: 'loginCtrl'
  })
   .state('home', {
        url: "/home",
        templateUrl: "home/home.html",
        controller:"homeCtrl"

  })
    .state('assetview', {
        url: "/assetview/:subServiceLineId/:serviceLineName",
        templateUrl: "assetview/assetview.html",
        controller: 'assetlistCtrl'

  })

我已将搜索栏放入index.html，以便在每个视图中都可见：

<body ng-app="starter">
  <ion-nav-bar>
        <ion-nav-back-button class="button-clear" side="left">
        </ion-nav-back-button>

          <ion-nav-buttons side="right">
            <sos-header></sos-header>
              <button class="ion-ios-search-strong button-clear search-icon" ng-hide="showme" ng-click="searchclick()"></button>

          <div class="" ng-show="showme" style="width: 132%; height: 33px">
                    <div>
                        <label class="">
                              <input type="search" placeholder="Search" style="height: 28px; margin-left: -212px background-color:blue;">
                        </label>
                        <button class="button button-clear" ng-click="showme = false" style="padding-right: 98px;">
                        Cancel
                        </button>
                    </div>
                    <div>
                        <button class="button button-clear" ng-click="showme = false" style="padding-right: 98px;">
                        Cancel
                        </button>
                    </div>
          </div>
          </ion-nav-buttons>  


  </ion-nav-bar>

    <ion-nav-view>

    </ion-nav-view>

  </body>

如何在离子中创建全局搜索功能？

0 个答案: