-
Notifications
You must be signed in to change notification settings - Fork 404
Errors and Warnings
Angular formly provides you with some handy warnings and errors to keep you from using it incorrectly. It will direct you to these for additional help. If these don't help you, please file an issue on GitHub or join us on Gitter.
For every field, Angular formly will attempt to set a property on the options
called formControl
. This is the NgModelController
for that field. Possible reasons you could be seeing this are:
- The field has no form on the scope (shouldn't happen if you're using the latest version and the
formly-form
directive) - The element with the
ng-model
attribute for the field's template doesn't use thename
property with theid
property of the scope. You shouldn't have to do this unless you are opting out of formly's built-in templateManipulator
Fixes for this warning are:
- Add the appropriate attribute to the element with the
ng-model
attribute for the field's template so it has a name (as mentioned above) - On the field options, specify
noFormControl: true
. If this is common for fields of a specific type, then use defaultOptions
If you provide a templateUrl
as a property for a formly field or for a preconfigured template type, formly will attempt to load that template using $http
with the $templateCache
. If this request fails for some reason, you will see this warning.
Fixes for this warning are:
- Make sure that the URL is correct and that you're able to reach that URL (paste it into your browser to test)
- Use
template
instead oftemplateUrl
. This can be a little crazy for bigger templates. However, if you use Webpack'sraw-loader
then it's as simple asrequire('./my-formly-template.html')
. This is what I do, and it's a beautiful thing :-)
You may see this as template type undefined not supported
if you do, you failed to specify a type, template or templateUrl for a field. You must specify at least one. If you do see a type there then it is likely that the specified type was never registered with the formlyConfigProvider
using setTemplate
or setTemplateUrl
. Do that.
I feel like this is fairly self explanatory. Make sure you're only specifying one of the three options there for each field.
Same as above.
Formly will warn you when specifying properties that are not allowed for a field. This is to help you use formly correctly. To fix this, remove or move any of the specified extra properties to either the data
or templateOptions
property (templateOptions
if it's used by the template for the field, and data
for everything else).
If you're using the watcher
property, it can be an object (called a watcher
object) or an array of watcher
objects. Either way, all watchers must have a listener
property which is a string (expression) or a function. The expression
property is optional and you will not receive a warning for this property. See the documentation for more information.
In the link
function of the formly-field
directive, a number of things happen. If any of these goes wrong, you'll see this warning logged to the console and your field will never be added. Here are a few things to check if you see this error:
- Make sure you haven't seen any other warnings. If you have, fix those first.
- If you have any
templateManipulators
running, make sure those aren't throwing errors. Formly ships with onetemplateManipulator
built-in. If you believe this is the reason you're seeing the error, please file an issue with a reproducible example. - If your field specifies
wrappers
, or the template for your field type specifies any wrappers, or you register any wrappers for that field type (or with the namedefault
) then make sure that there is nothing wrong with these wrappers. It is likely that formly will let you know that something is wrong with the wrappers if there is. - Make sure that there's not an issue in the template itself. Angular will throw a parse error if this is the case, so you should know if this is the issue.
It is recommended to disable warnings in production using formlyConfigProvider.disableWarnings = true
. Note: This will not disable thrown errors, only the console.warn
messages.