Question

我在Ionic上开发我的第一个应用程序，我需要在列表页面中共享数据，当我点击项目时，我需要在弹出窗口中显示项目详细信息（我尝试单页，不工作）

目前我正在制作此代码：

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

    // SEXTA REGION
    // Accordeon para la lista de ciudades
    $scope.groups = [
    {
        id_ciudad: 61,
        name: "Santa Cruz",
        emprendedores: [{
            id_emprendedor: 611,
            nombre: "Cabañas El Salto",
            telefono: "+56912345678",
            servicio: "alojamiento"
        }]
    },
    {
        id_ciudad: 62,
        name: "Marchigue",
        emprendedores: [{
            id_emprendedor: 621,
            nombre: "Cabañas Las Luciérnagas",
            telefono: "+56912345678",
            servicio: "alojamiento"
        }]
    }
    ];
})

显示列表的HTML：

<ion-view view-title="" hide-nav-bar="false" hide-back-button="false">
    <ion-content class="int-regiones" ng-controller="CiudadesCtrl">
        <h1 class="col-100">Región de O'Higgins</h1>
        <div class="featured">
            <img src="img/mapa-region-6.jpg" alt="" />
        </div>
        <div class="content">
            <div class="list col-100">
                <ion-list>
                    <div ng-repeat="group in groups">
                        <ion-item class="item-stable" ng-click="toggleGroup(group)" ng-class="{active: isGroupShown(group)}">
                            <i class="icon" ng-class="isGroupShown(group) ? 'ion-minus' : 'ion-plus'"></i>
                            &nbsp;
                            {{group.name}}
                        </ion-item>
                        <ion-item ng-repeat="item in group.emprendedores" class="item-accordion" ng-show="isGroupShown(group)">
                            <a id="{{group.id}}" class="item item-avatar" href="#/app/emprendedor/{{item.id_emprendedor}}">
                                <img src="img/ico-{{item.servicio}}.png">
                                <h2>{{item.nombre}}</h2>
                                <span>{{item.telefono}}</span>
                            </a>
                        </ion-item>
                        <!-- -->
                    </div>
                </ion-list>
            </div>
        </div>
    </ion-content>
</ion-view>

当用户点击项目时，我需要显示带有详细信息的弹出窗口和带有＆＃34;拨打电话的按钮＆＃34;动作

事先，谢谢

Answer 1

查看$ionicModal。

def autoscale_y(ax,margin=0.1):
    """This function rescales the y-axis based on the data that is visible given the current xlim of the axis.
    ax -- a matplotlib axes object
    margin -- the fraction of the total height of the y-data to pad the upper and lower ylims"""

    import numpy as np

    def get_bottom_top(line):
        xd = line.get_xdata()
        yd = line.get_ydata()
        lo,hi = ax.get_xlim()
        y_displayed = yd[((xd>lo) & (xd<hi))]
        h = np.max(y_displayed) - np.min(y_displayed)
        bot = np.min(y_displayed)-margin*h
        top = np.max(y_displayed)+margin*h
        return bot,top

    lines = ax.get_lines()
    bot,top = np.inf, -np.inf

    for line in lines:
        new_bot, new_top = get_bottom_top(line)
        if new_bot < bot: bot = new_bot
        if new_top > top: top = new_top

    ax.set_ylim(bot,top)

示例：http://codepen.io/ionic/pen/gblny

使用Ionic在弹出窗口中显示项目详细信息

1 个答案: