I've been chasing this bug down for a week now and I'm about to tear my
hair out.
This should be about the simplest thing in the world.
I've got a CMS I'm working on, completely custom deal for an inhouse
replacement for sharepoint.
The front-end is pure angular, there are no "non-angular" bits involved.
As part of the CMS I have written a module to create and display custom
forms.
These forms are then stored to the database as JSON object which describes
their construction and then displayed to the user via a custom directive.
Everything works really good, except that I have given users the ability to
custom databind certain variables off the rootScope, and while those
variables display correctly, they do not appear to be updating when I go to
persist them.
The directive is something I pulled from a similar post on stack exchange.
.directive('dynamicModel', ['$compile', function ($compile) {
return {
'link': function(scope, element, attrs) {
scope.$watch(attrs.dynamicModel, function(dynamicModel) {
if (attrs.ngModel == dynamicModel || !dynamicModel)
return;
element.attr('ng-model', dynamicModel);
if (dynamicModel == '') {
element.removeAttr('ng-model');
}
// Unbind all previous event handlers, this is
// necessary to remove previously linked models.
element.unbind();
$compile(element)(scope);
});
}
};
}])
This is used in the following way...
<li class="list-group-item fade-in" ng-repeat="field in currentForm.fields"
>
<label>{{field.displayname}}
<span ng-if="field.type != 'list' && field.type !='image' &&
field.type !='range' && field.type != 'number'">
<input class="form-control" type="{{field.type}}" name=
{{field.name}} value="{{field.value}}" dynamic-model="field.databind"
required="{{field.isRequired}}">
</span>
</label>
</li>
Note that currenfForm.fields is rootScope, and field.databind if it exists,
will also refer to a rootScope variable such as
$rootScope.currentUser.email however the actual content of field.databind
would be "currentUser.email"
The problem I have, is that when I submit the form I preserve all globals,
but the field isn't present on the global.
This seems to be a problem if we are binding to something that wasn't
previously part of the original global. For instance my profile form has a
.displayname field. Since it's the user's first time filling out the
profile, We won't have currentUser.displayname yet, and so rootScope
doesn't get one added. Instead there seems to be local scope.currentUser
which is created. but then it only has the fields relevant to the form. I
can't persist that because it doesn't have the requisite fields like ._id
that I need, and also it only has the fields declared in the form.
So in short, it appears that for better or worse, I have 2 currentUser
objects. One rootScope.currentUser which contains the bulk of currentUser
info, and then scope.currentUser which contains only the variables within
the form.
I need to merge them and keep them in sync, or better yet ditch the local
copy and make sure my form databinds are always on the global scope even if
the global scope variable didn't exist yet.
Thanks for any advice!
--
You received this message because you are subscribed to the Google Groups
"AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.
