Вот проблема:
Я пытаюсь сделать что-то вроде этого:
Вот соответствующий jsfiddle, который я сделал, с комментариями:
http://jsfiddle.net/wkmm576m/7/
Вот код, который, я думаю, создает проблемы...:
app.directive('addEditInput', function() {
return {
restrict : 'E',
template : '<div id="editForm"><input type="text" ng-model="currentVar.name" /><br/></div>'
}
});
Фактически, я возвращаю шаблон с ng-моделью. Но ng-модель не обновляется, когда ее значение изменяется из любого другого места...
Tbh, я немного смущен директивами и областями связи - данные....
Спасибо за чтение/помощь
Короткий ответ - вам нужно вызвать $scope.$apply
в верхнем контроллере: http://plnkr.co/edit/QEjzlsJj4fh1eeqBXSvt?p=preview
Длинный ответ: вы связываете обычную js-функцию с обычным js-событием, поэтому, когда пользователь нажимает на элемент - ваша функция выполняется. Это все. Когда вы используете ng-click - это вызовет цикл дайджест, и ваши привязки будут обновлены. Поэтому вам нужно вызвать его вручную, поэтому вы вызываете $scope.$apply
.
Примечание: лучше не использовать jquery, где вам не нужно. Т.е. используйте $element.bind('click',function(){
вместо $().on...
$element.bind('click',function(){
$().on...
set
для нее нет, и вместо этого используйтеng-click
по кнопке в шаблоне, чтобы установить ее, что исключает необходимость вызова$apply
вручную. Если бы он наследовал область действия, то его расширение могло бы быть проблематичным, но, как не так, это нормально. Смотрите скрипку: jsfiddle.net/wkmm576m/8