Как сделать встроенное редактирование в angularjs без шаблона?

Question

пытается написать функцию редактирования рядного без использования шаблона, как описано здесь http://plnkr.co/edit/EsW7mV?p=preview

Answer 1

Вы можете просто разместить код шаблона на главной странице.

<li ng-repeat="todo in todos" inline-edit="todo.title" on-save="updateTodo(todo.title)" on-cancel="cancelEdit(todo.title)"> 
    <div> 
    <input type="text" on-enter="save()" on-esc="cancel()" ng-model="model" ng-show="editMode"> 
    <button ng-click="cancel()" ng-show="editMode">cancel</button> 
    <button ng-click="save()" ng-show="editMode">save</button> 
    <span ng-mouseenter="showEdit = true" ng-mouseleave="showEdit = false"> 
    <span ng-hide="editMode" ng-click="edit()">{{model}}</span> 
    <a ng-show="showEdit" ng-click="edit()">edit</a> 
    </span> 
    </div> 
</li> 

Здесь есть скрипка:

http://jsfiddle.net/siliconball/QwDn9/2/

Также temeber забрать templateUrl: 'inline-edit.html'

Если вам нужен объем контроллера для какого-либо причине места scope: false в директиве. Но тогда вам придется отслеживать, какой вариант вы редактируете в любой момент (возможно, используя идентификатор). Если это ваша ситуация, я предлагаю реорганизовать немного, как вы знаете, вероятно, это не самый лучший вариант.

Если ваша ситуация, я думаю, это то, что вы хотите написать все на одной странице, потому что вы генерируете ее через CGI или динамический контентный скрипт, и вы не хотите писать один и тот же код на разных страницах (+ скрипты интерфейсов ...), то я предлагаю также переместить inline-edit="todo.title" и все директивы в <div> ради ортогональности.