Это не должно быть слишком сложно, но я не могу понять, как это сделать.
У меня есть родительская директива, например:
directive('editableFieldset', function () {
return {
restrict: 'E',
scope: {
model: '='
},
replace: true,
transclude: true,
template: '
<div class="editable-fieldset" ng-click="edit()">
<div ng-transclude></div>
...
</div>',
controller: ['$scope', function ($scope) {
$scope.edit = ->
$scope.editing = true
// ...
]
};
});
И дочерняя директива:
.directive('editableString', function () {
return {
restrict: 'E',
replace: true,
template: function (element, attrs) {
'<div>
<label>' + attrs.label + '</label>
<p>{{ model.' + attrs.field + ' }}</p>
...
</div>'
},
require: '^editableFieldset'
};
});
Как я могу легко получить доступ к свойствам model
и editing
родительской директивы из дочерней директивы? В моей функции ссылок у меня есть доступ к родительской области - следует ли использовать $watch
для просмотра этих свойств?
Соединяясь, я бы хотел:
<editable-fieldset model="myModel">
<editable-string label="Some Property" field="property"></editable-string>
<editable-string label="Some Property" field="property"></editable-string>
</editable-fieldset>
Идея состоит в том, чтобы по умолчанию отображался набор полей. Если нажать, они станут входами и могут быть отредактированы.