代码之家  ›  专栏  ›  技术社区  ›  quma

如何在AngularJS中添加第三个可编辑按钮?

  •  2
  • quma  · 技术社区  · 9 年前

    我有一个关于AngularJS可编辑框架的问题。使用可编辑时,会出现两个按钮:保存按钮和取消按钮。然而,我想要第三个按钮(带减号)来删除可编辑文本。如何添加第三个删除按钮?

    以下是我之前的一个问题:

    Example with only two buttons

    <a href="#" editable-text="user.name">{{ user.name || 'empty' }}</a>
    
    1 回复  |  直到 9 年前
        1
  •  1
  •   Md Hasan Ibrahim    9 年前

    不要认为他们现在就支持这一点。 我自己做的。

    var app = angular.module("app", ["xeditable"]);
    
        app.run(function (editableOptions) {
            editableOptions.theme = 'bs3';
        });
    
        app.controller('Ctrl', function ($scope) {
            $scope.user = {
                name: 'awesome user'
            };
    
            $scope.showClear = function () {
                $scope.show = true;
            }
    
            $scope.empty = function () {
                $scope.user.name = "";
                $scope.show = false;
            }
        });
    
    <h4>Angular-xeditable Text (Bootstrap 3)</h4>
    <div ng-app="app" ng-controller="Ctrl">
        <span href="#" editable-text="user.name" ng-click="showClear()">{{ user.name || 'empty' }}</span>
        <button class="btn btn-default" ng-click="empty()" ng-show="show">
            -
        </button>
    </div>
    

    希望这会有所帮助:)。