如何在离子框架中添加行上的图标?

时间:2015-04-25 05:52:19

标签: angularjs angularjs-directive angularjs-scope ionic-framework ionic

我正在尝试在离子中进行简单的演示。我有一个页脚有一个图标离子构图(左下角图标)。当我点击该图标时会显示一个弹出屏幕,我在文本字段中输入名称,然后按保存按钮。然后它生成一行,该行具有与弹出屏幕的文本字段中所写的相同的文本。我需要在行上添加图标按钮(如删除按钮,编辑按钮)。我可以在动态生成的行中添加图标,就像我在页脚中做的那样(左下角离子作曲家)?

请在行上添加

这是我的代码

http://codepen.io/anon/pen/qdEEPW

   <ion-item ng-repeat="item in items">
                {{item.testcase}}
                <ion-reorder-button class="ion-navicon"></ion-reorder-button>

            </ion-item>

请按页脚左侧的底部按钮。点击它显示弹出snd填充条目它会生成行。我需要在行上添加图标  我将展示我想要的图像 enter image description here 我需要在行上删除图标和编辑按钮图标..您可以从此链接中选择amy图标 http://ionicons.com/

1 个答案:

答案 0 :(得分:1)

相关:how to add icons in row which is generated dynamically in ionic

添加了图标。 您必须添加按钮的功能。

HTML:

    <ion-item ng-repeat="item in items">
        {{item.testcase}}
      <button class="button {{item.close}}"></button>
      <button class="button {{item.edit}}"></button>

JS:

myPopup.then(function(res) {
        console.log('Tapped!', res);
        if(typeof res!='undefined')
          res.edit="ion-edit";
          res.close="ion-close";
        $scope.items.push(res)

        console.log($scope.items);
    });

http://codepen.io/anon/pen/XbJJzO