Как вызвать директиву при обновлении модели в AngularJS?

Я нашел хорошее решение для встроенного редактирования содержимого в угловых js, которое создается путем запуска ng-repeat на модели:https://stackoverflow.com/a/16739227/2228613

Чтобы расширить это решение, я добавил на страницу кнопку с директивой ng-click следующим образом:


 Add Category

Функция addCategory определена в моем контроллере:

$scope.addCategory = function(){
    var newCategory = {id:0, name:"Category Name"};
    $scope.categories.unshift(newCategory);
}

Цель здесь - позволить пользователю добавить новую запись и автоматически вызвать директиву inline-edit, как только представление обновится новой строкой. Как я могу вызвать директиву inline-edit таким образом?

 Mr_Green01 февр. 2017 г., 16:09

Ответы на вопрос(2)

Решение Вопроса

которую ямы использовали, чтобы иметь логические значения изменения и иметь$watch на нем внутри директивы, которая должна быть запущена.

myApp.directive('myDirective', function () {
    return function (scope, element, attr) {
            scope.$watch('someValue', function (val) {
                if (val)
                    // allow edit
                else
                    // hide edit
            });
     }
});

Тогда в вашем контроллере выд установить$scope.someValue = true; в вашем нг-клик для кнопки.

plunker:http://plnkr.co/edit/aK0HDY?p=preview

UPDATEI»

мы пошли немного дальше с ответом выше. Я'мы сделали что-то более похожее на то, что тыпосле.

Вот'Вот что значит:http://plnkr.co/edit/y7iZpb?p=preview

Это новая директива:

  .directive('editCar', function ($compile) {
      return {
        restrict: 'E',
        link: function (scope, element, attr) {
          var template = '<span class="car-edit">'+
          '<input type="text" ng-model="car.name">' +
          '<button ng-click="someValue = false" class="btn btn-primary">Save</button></span>';
          scope.$watch('someValue', function (val) {
              if (val) {
                  $(element).html(template).show();
                  $compile($('.car-edit'))(scope);
              }
              else
                  $(element).hide();
          });
        }
      }
  })

Заменяет элемент с вышеуказанным шаблоном. Кнопка сохранения добавляет значения в массив с именемeditedCars, Я'оставил в некотором фиктивном коде для отправки всего$http.post()

 jzm17 июн. 2013 г., 05:10
да, вы можете сделать это. Я'Мы обновили мой пост другим плункером. Это больше похоже на то, что выпосле.
 jzm19 июн. 2013 г., 08:14
ограничить 'E' означает, что директива будет влиять только на элемент. в моем примере это <редактировать автомобиль> </ Редактировать автомобиль>, По умолчанию «А» который является атрибутом, например <div edit-car> </ DIV>, Там'также 'C' который является КЛАССОМ, например <div class = "редактировать автомобиль "> </ DIV>
 novon17 июн. 2013 г., 03:28
на самом деле, теперь, когда я думаю об этом, могу ли я просто сфокусироваться. $ watch ('Todos', функция (val) {...}) для отслеживания любых изменений в массиве, содержащем объекты todo?
 novon17 июн. 2013 г., 03:19
Как директива узнает, для какой записи в модели вызывается функция inline-edit?
 novon18 июн. 2013 г., 07:56
большое спасибо за вашу помощь, чтоrestrict: 'E' имею в виду?

http://plnkr.co/edit/uzuKki (Я работал над оригинальным пакетом, как вы упомянули.)

Моя идея

Добавлять "режим редактирования" свойство модели TODOВместо того, чтобы просто пройтиtodo.title к директивеs, передавая весь объект TODO, которыйinline-edit="todo" в index.htmlВ inline-edit.html меняйте каждыйeditMode вmodel.editMode (и каждыйmodel вmodel.title правильно отображать заголовок)

В вашем контроллереadd метод, создать новый объект сeditMode = trueнапример,

var newTodo = {id:0, name:"TODO Name", editMode: true};
$scope.todos.unshift(newTodo);

Ваш ответ на вопрос