I have something like this:{{item.bla|| item.bla2}}
how can i put this in ng-model, i can't just do it like this:
input class="form-control" type="text" ng-model="{{item.bla || item.bla2}}"
Maybe this will help (assuming item is in scope):
<input class="form-control" type="text" ng-init="model= item.bla || item.bla2"
ng-model="model" />
Related
<input type="text" ng-model="num1">
<input type="text" ng-model="num2">
I want to compare numbers entered in above fields and generate error message if num1 < num2 using ng-form. We can do with JS but i want to keep validation simple. Can we implement in HTML tag using ng-form
Try something like this:
<div ng-form="regForm">
<span ng-show="num1>=num2">Num1 cannot be greater than num2</span>
<input name="num1" type="text" ng-model="num1">
<input name="num2" type="text" ng-model="num2">
</div>
JsFiddle: https://jsfiddle.net/sktajbir/6fmvsaf0/25/
Hope this will help you. Thanks.
I am trying to do some math with user inputs.
I have this basic objets to start with
$scope.shape =
{id: 1, cx: 0, cy: 0, result: 0}
;
And the user can type the value of cx and cy into fields;
<input ng-model="shape.cx" type="text" class="form-control" id="cx">
<input ng-model="shape.cy" type="text" class="form-control" id="cy">
I want to multiply the 2 values cx and cy and show the result in another input.
<input type="text" class="form-control" id="A" ng-model="shape.cx * shape.cy">
This is working, I can see the the result in the field but I get an error;
Error: [ngModel:nonassign]
I would also like to asign this result to shape.result.
How can I set the value of shape.result to be shape.cx*shape.cy
See here it could be done like this :
SCENARIO 1 : Result on Button Click : (Procedural Approach)
<input ng-model="shape.cx" type="text" class="form-control" id="cx">
<input ng-model="shape.cy" type="text" class="form-control" id="cy">
<input type="button" class="form-control" ng-click="calculate()">
<input type="text" class="form-control" id="A" ng-model="shape.result">
$scope.calculate = function(){
$scope.shape.result = parseInt($scope.shape.cx) * parseInt($scope.shape.cy);
}
SCENARIO 2 : As soon as Value Changes in text boxes : (Direct Approach)
<input ng-model="shape.cx" type="text" class="form-control" id="cx">
<input ng-model="shape.cy" type="text" class="form-control" id="cy">
<input type="text" class="form-control" id="A" ng-model="parseInt(shape.cx) * parseInt(shape.cy)">
SCENARIO 3 : Using $watch : (Procedural Approach)
<input ng-model="shape.cx" type="text" class="form-control" id="cx">
<input ng-model="shape.cy" type="text" class="form-control" id="cy">
<input type="text" class="form-control" id="A" ng-model="shape.result">
$scope.$watch(function (){
$scope.shape.result = parseInt($scope.shape.cx) * parseInt($scope.shape.cy);
});
Note :
Scenario 3 is using $watch hence it should be not used untill and unless you're in real need of it.
Scenario 1 is best suited to you I think as it will make your concept.
Scenario 2 is a direct approach hence should be used after gaining some knowledge as well as experience(But it's short & best within 3 scenatios). It's a reference from #tapos answer
Thanks & Cheers
Well you need to watch for cy and cx changes and do the calculation when it change.
$scope.$watch('shape.cx', function() {
$scope.shape.result = $scope.shape.cx * $scope.shape.cy;
});
Example fiddle: http://jsfiddle.net/ccmf07k2/
Every language input field is string when a user enter any number in text box it is string
<input ng-model="shape.cx" type="text" class="form-control" id="cx">
<input ng-model="shape.cy" type="text" class="form-control" id="cy">
so you need some work in your result box ix
<input type="text" class="form-control" id="A" ng-model="parseInt(shape.cx) * parseInt(shape.cy)">
then you get your appropriate result
I have a search field and i want that the binding of search textbox reflected after some time.Thanks in advance.
Here is my code
<div ng-controller="appointment as vm">
Search By Description : <input class="form-control" placeholder="search by description" type="text" ng-model="vm.filterText" />
{{vm.filterText}} </div>
You could use ng-model-options on your input field
<input type="text" ng-model="vm.filterText" ng-model-options="{debounce: { 'default': 10000}"/>
the ng-model-options directive will surely help you. You can update the binding after specified time or on blur event.
try this code
Search By Description : <input class="form-control" placeholder="search by description" type="text" ng-model="vm.filterText" ng-model-options={ debounce: 1000 } />
See example of ng-model-options http://learnit.visrosoftware.com/try/kfPWlU4N
Try using $interval in your directive. If you can share your directive as well, that will help.
<input id="declarationAcknowledgement" name="declarationAcknowledgement" ng-false-value="false" ng-model="formData.declarationAcknowledgement" ng-true-value="true" type="checkbox" />
<label data-localize="I Agree" for="declarationAcknowledgement" >I Agree</label>
<div class="pw-form-inline-error" data-localize="Accept to proceed" ng-show="(peopleworksForm.declarationAcknowledgement.$dirty || peopleworksForm.submited) && formData.declarationAcknowledgement != 'true'">Accept to proceed</div>
this is my view side inside my controller I set "Form.submited = true"
what I want is if the user check the check box if value is not equals to 'true' set the form.$valid false from view side not in controller how can I do this. Can any one help me?
try this.. add required="required" and make ng-false-value=""
<input required="required" name="declarationAcknowledgement" ng-false-value="" ng-model="formData.declarationAcknowledgement" ng-true-value="true" type="checkbox" />
I want to add to the following:
<input type="radio" ng-name='{{quest.id}}' ng-model='$parent.$parent.choice.input' ng-value='{{option}}' id='{{quest.id}}-{{option.id}}' ng-required='required'>
An attribute: ng-checked='checklast'
only if some condition is true,how do i do that?
just an example
<input type="radio" ng-checked="testModel.child_1 && testModel.child_2" ng-model="isChecked"/>
EDIT
if you using ng-repeat for displaying the list of radio then
<input type="radio" ng-name='{{quest.id}}' ng-model='$parent.$parent.choice.input' ng-value='{{option}}' id='{{quest.id}}-{{option.id}}' ng-required='required' ng-checked="$index == $last">