I have an input field and I want to set a default value when the user does not write anything.
I read several answers here on Stackoverflow that suggest using ng-init or setting the default value to the scope in the controller.
Both suggestions work to set a default value, but neither of them allow the user to edit the field later. The value is always the default one.
How can I set a default value and be able to edit it later? Thank you!
My input field:
input type="text" ng-model="action.parameters.subject"
You should be able to set an initial value using databinding with the ngModel directive.
In your template:
<input type="text" [ngModel]="test">
In your component file:
test = 'initial value'; // some initial value
The user will be able to change it, but it will initially hold the value of the test variable.
Related
I am really new to AngularJS so my question might be a bit silly. I am trying to solve a problem where I have two input fields which uses the same ng-model and I'd like the put value in one field not have the other input field displaying that value. I know it is desired that when I type in some value in one of the input fields it automatically reflects in the other. I wonder if there's any work around so that when I put value in one input, it does not show up in the other input field.
Here's how you can achieve this:
<input ng-model="foo">
<input value="{{::foo}}">
The second inputs' value will be set to the initial value of foo but it's one time bound. Changing foo after this will no longer affect it.
Furthermore, if you want the second input to update the first but the first not to update the second, you could go:
<input ng-model="foo">
<input ng-init="bar=foo"
ng-model="bar"
on-change="updateFoo()">
// And, inside controller:
$scope.updateFoo = function() {
$scope.foo = $scope.bar;
};
I have this input:
<input type="number" id="totWeight" ng-model="totWeight" ng-value="getTotWeight()" />
which value is calculated based on other fields, but it can also be inserted manually via the input field.
The problem is that when it's calculated, ng-model remains empty, so I tried to assign the calculated value if (!$scope.totWeight) when I send the data to the server, which is not optimal. Further if I insert a value via the input field and then change the other fields mentioned above which trigger the getTotWeight() function, the $scope.totWeight has a value so it won't get updated with the above if (!$scope.totWeight).
Sorry, I don't know how to explain it. Hopefully someone can help me with that.
The purpose of the NgValue directive is as the docs says
It is mainly used on input[radio] and option elements, so that when
the element is selected, the ngModel of that element (or its select
parent element) is set to the bound value.
So when using input type "number" you should not use it as it's value actually will be in the NgModel instead.
If you want to trigger an event when the input is change, key is press etc you should use the NgChange, NgKeypress etc instead to trigger the function.
The value will be keept in the NgModel for all situations.
I'm pretty new to angular world and I have an issue with it.
I'm working with ejs too.
I have an input that I want to fill (value) with an ng-model.
The problem is my model is empty while the user doesn't specify a value.
I want to display a default value when my model is empty. This default value is sending by the ejs (server side). Doing that, I can't set a default value in my controller.
To do so I wrote the following :
<input type="text" ng-model="owner_adress" ng-value="'{{owner_adress || '<%=user.owner_adress%>'}}'"/>
If I look into my code, I can see the value is okay (ejs result when my model is empty, my model value otherwise) but the value is not displayed in my input (ie the user can't see it).
I looked for a work around (ng-cloak was fine but I can't use it in my input field).
Any clue would be nice !
Use ngInit directive instead. If owner_adress is defined in controller it will be used, otherwise it will default to serverside rendered value:
<input ng-model="owner_adress" type="text"
ng-init="owner_adress = owner_adress || '<%=user.owner_adress%>'"/>
I want to initialize variable test on value from formErrors.field1 but it doesn't work.
{{formErrors.field1}} // show content
<input ng-model="test" ng-init="test = formErrors.field1" /> // input field is empty
{{test}} // doesn't show content
I'm using Angular version angular-1.3.0-rc.1
If the field value gets set after the page loads, maybe it could explain why you face this issue.
I use ng-init mostly to set values directly, not to copy the value of another scope variable.
I'm reviewing the CakePHP documentation and, about forms and the FormHelper, I'm a bit confused about options to set default values for inputs.
From documentation:
Default option (here):
$options['default'] Used to set a default value for the input field.
The value is used if the data passed to the form does not contain a
value for the field (or if no data is passed at all).
Selected option (here):
$options['selected'] Used in combination with a select-type input
(i.e. For types select, date, time, datetime). Set ‘selected’ to the
value of the item you wish to be selected by default when the input is
rendered:
Later, for FormHelper::select (here):
Creates a select element, populated with the items in $options, with
the option specified by $attributes['value'] shown as selected by
default.
The only thing of which I am sure, I have to use "checked" for checkboxes:
You cannot use default to check a checkbox - instead you might set the
value in $this->request->data in your controller, or set the input
option checked to true.
Is there anyone who can explain me clearly how to use these options? Thank you very much.
Value: The content of the value attribute, i.e. <input value="Foo" />
Default: A default value if none is provided (e.g. in $this->request->data).
Checked: A checkbox can be checked, which is unrelated to the value attribute, i.e. <input type="checkbox" value="yes" checked="checked" />
Hope that helps.