Как написать функцию для целевой переменной для NG отключить, что внутри NG повтора?

Я пытаюсь построить список задач в угловых. Когда вы добавляете новый элемент, он будет добавлен в поле ввода (по умолчанию я установил его как отключенный) внутри таблицы, а также добавит ссылку "Изменить" рядом с этим входом. Как только я нажму на Edit, поле ввода активируется. (Я получил это работает с этим кодом (Edit).

Мой вопрос заключается в том, как заменить ng-click="editable=! Editable" на ng-click="edit()". Я пытался написать эту функцию редактирования, но я не могу заставить ее работать. Пожалуйста помоги. Мой код на jsfiddle

Спасибо.

<body ng-app="shoppingList">
<div  ng-controller="mainController">
    <h1>My Shopping List</h1>
    <form class="form-inline" ng-submit="addItem()">
        <div class="form-group">
        <input type="text" ng-model="newItem">
        </div>
        <input type="submit" value="Add">   
    </form>
    <div>
        <table>
            <thead>
                <tr>
                    <th>Item</th>
                    <th>Edit</th>
                </tr>
            </thead>
            <tbody>
                <tr ng-repeat="item in items track by $index">
                    <td><input ng-disabled="!editable" type="text" value="{{item}}"></td>
                    <td ng-click="editable=!editable">Edit</td>
                </tr>
            </tbody>
        </table>
    </div>
</div>  
<script>
(function(){
    var app = angular.module('shoppingList',[]);
    app.controller('mainController',function($scope){
        $scope.items=[];
        $scope.addItem = function(){
            $scope.items.push($scope.newItem);
        };

    $scope.edit = function(){
    // i need to move editable=!editable into this function
    // but i don't know how to do that
    }

    });

}());
</script>
Источник

1 ответ

Решение

Вы можете сохранить редактируемое свойство todo пункт, а затем нам это так.

$scope.addItem = function(){
    $scope.items.push({text: $scope.newItem,editable:false});
}; 

$scope.edit = function(item){    
   item.editable = !item.editable; 
   console.log(item)   
}
$scope.save = function(item){
  console.log("saved")     
   item.editable = !item.editable; 
 }

HTML

<tr ng-repeat="item in items track by $index">
 <td><input ng-disabled="!item.editable" ng-blur="save(item)" type="text" value="{{item.text}}"></td>
<td ng-click="edit(item)">Edit</td>
</tr>

Я думаю, что это самый простой, но всегда есть лучший подход. Дайте нам знать. Что такое ngBlur

Источник
Другие вопросы по тегам