javascript - x-可编辑: turn off inline editing for non admin users

Question

我正在使用 X-Editable 插件通过 angular.js 进行内联编辑内嵌编辑工作完美。但是，我想为非管理员用户禁用此功能。

HTML:

<div ng-controller="OnaftersaveCtrl">
   <a href="#" editable-text="user.name" onaftersave="updateUser()">
   {{ user.name || 'empty' }}
   </a>
</div>

JS:

var app = angular.module("app", ["xeditable"]);
app.run(function(editableOptions) {
  editableOptions.theme = 'bs3'; // bootstrap3 theme. Can be also 'bs2', 'default'
});

app.controller('OnaftersaveCtrl', function($scope, $http) {
$scope.user = {
  id: 1,
  name: '<?=$test?>'
};

$scope.updateUser = function() {
    $http({
        method: 'post',
        url: '/test',
        data: $scope.user,
        headers: {'Content-Type': 'application/x-www-form-urlencoded'},
      }).
      success(function(response) {
          alert(response);
      }).
      error(function(response) {
          alert("not ok");
      });
      return false;
    };

});

我尝试将 html 代码放入 id 中。

$('#myselector').editable('option', 'disabled', true);

但是，它没有渲染初始值。 (这里是来自 php 的测试变量)。

Answer 1

我需要具有相同的功能，我在 https://github.com/vitalets/angular-xeditable/pull/206 上发现了一些问题，但没有一个是固定的。我必须快速完成任务，因此我选择用另一个不具有可编辑属性的元素替换该元素。

<i>
<span ng-if="accounts.editOptions.isEditable" editable-text="account.clientCompanyXMLEntity.industry" ng-bind="account.clientCompanyXMLEntity.industry || 'add industry'"></span> 
<span ng-if="!accounts.editOptions.isEditable" ng-bind="account.clientCompanyXMLEntity.industry || 'add industry'"></span>
</i>

在我的 Controller 中我有:

$scope.accounts.editOptions.isEditable = false;
$scope.accounts.editOptions.toggleEditability = function() {
    $scope.accounts.editOptions.isEditable = !$scope.accounts.editOptions.isEditable;
};