Question

我正在尝试在我的离子应用中创建一个具有以下行为的菜单。

点按一次以显示该菜单项的说明。
再次点按以导航到该页面或运行指定的功能。

我确实在模板中对整个菜单进行了硬编码，但是如果有一个带有菜单项的对象会更好。这让我想到了如何在对象中包含一个函数的主要障碍。

OR

我是以完全错误的方式解决这个问题，在这种情况下，您的建议将不胜感激。

示例代码是：

SemiModalAnimatedTransition

模板：

angular.module('ionicApp', ['ionic'])

.controller('AppCtrl', function($scope, $state) {

  $scope.menuItems = [{
      "title": "Create a Programe",
      "icon": "ion-compose",
    "description" : "Search and add exercises to your prgoramme before sending to your patient"
/*      "action": "openCreateFullProgrammeModal()"
      "action": $state.go('app/clients')
      "action": $state.go('app/programmes')*/
    }, {
      "title": "My Clients",
      "icon": "ion-android-people",
      "description" : "view all your clients"
/*      "action": "openCreateFullProgrammeModal()"
      "action": $state.go('app/clients')
      "action": $state.go('app/programmes')*/
    }, {
      "title": "Programmes",
      "icon": "ion-clipboard",
      "description" : "Browse your programe library"
/*      "action": "openCreateFullProgrammeModal()"
      "action": $state.go('app/clients')
      "action": $state.go('app/programmes')*/
    }

  ]

});

可以找到codepen here

非常感谢。

修改

This是我最终做的......

Answer 1

首先，您对菜单进行硬编码的方法不实用，您应该使用ng-repeat。

这里的第二个是用于点击功能的编码器，我做了一个示例来向您展示如何制作它，您可以扩展它并实现go功能。

here is the codepin

Ionic app在第二次点击时运行功能

1 个答案: