Reputation: 147
I am creating a wrapper that will display the model value as a normal text on the page. When mouse over is triggerd on this text it will transform into a formly-field, this workes great. The problem i have is that the normal text wont change when an edit has been made in the field, so how do i get the value of the model from the field if this is possible?
I made a bin as an example of my problem.
the Wrapper:
template: [
'<div ng-hide="to.editorEnabled" >',
'<div ng-mouseover="to.editorEnabled=true">',
'{{to.label}}</br>',
'{{to.value}}',
'</div>',
'</div>',
'<div ng-show="to.editorEnabled" ng-mouseleave="to.editorEnabled=false">',
'<formly-transclude></formly-transclude>',
'</div>'
]
Field and model:
vm.model = {textField: "Mouse over this field"};
vm.fields = [
{
key: 'textField',
type: 'input',
templateOptions: {
label: 'Text Label',
type: 'text',
value:vm.model.textField
}
}];
Upvotes: 0
Views: 1814
Reputation: 147
Problem was solved using formly watchers.
Code with watcher:
vm.fields = [
{
key: 'textField',
type: 'input',
templateOptions: {
label: 'Text Label',
type: 'text',
value:vm.model.textField
},
watcher: {
listener: function(field, newValue, oldValue, scope, stopWatching) {
if(newValue) {
field.templateOptions.value = newValue;
}
}
}
}];
Upvotes: 1