Редактирование имен вкладок с двойным щелчком в Angular UI

Question

Редактирование имен вкладок с двойным щелчком в Angular UI

0

В этом plunk у меня есть угловой пользовательский интерфейс с вкладками, которые создаются динамически.

Моя цель - дважды щелкнуть по имени вкладки (заголовок табуляции), сделать имя редактируемым, изменить имя пользователя и нажать "Enter", чтобы выйти из режима редактирования.

Я не знаю, как подойти к этому. Есть идеи?

Javascript

  $scope.tabs = [
    { title:'Name 1', content: "Content 1" },
    { title:'Name 2', content: "Content 2" },
    { title:'Name 3', content: "Content 3" }
  ];

HTML

<uib-tabset>
   <uib-tab ng-repeat="t in tabs" heading="{{t.title}}" >
     {{t.content}}
   </uib-tab>
</uib-tabset>

ps0604 04 авг. 2016, в 14:14

Источник

Теги:

angularjs

angular-ui

1 ответ

Ещё вопросы

tirpitz.verus · Accepted Answer · 2016-08-04T11-19-00.000Z

Просто добавьте свойство к своей модели, которое будет указывать, является ли поле редактируемым или нет. Вместо того, чтобы просто реагировать на двойное нажатие на пользователя (от углового) и нажатие Enter (настраиваемая директива).

http://plnkr.co/edit/1zOKx2NCXaCjnPHJB1rn?p=preview

<input type="text" ng-model="t.content" ng-readonly="t.disabled" ng-dblclick="t.disabled = false" my-enter="t.disabled = true"></input>