Here's a Plunkr: http://plnkr.co/edit/Vr3z4bxFmsiJPs1ye2Vd.
The ngRepeat directive adds an empty option at the top when ngIf is present on the first option element which is supposed to be default.
Is there anyway to avoid that?
I want to use ngRepeat, not ngOptions.
Thanks.
ng-model binds two-way, so you are trying to bind the selection to numbers instead of variables, and I don't know what exactly are you trying to do... but this is the cause of the problem
Related
I'm building a questionnaire out of directives which show the correct input based on certain expectations. Those expectations (including any formerly given input from the user) comes from a parent $scope. Everything is set up in the link function of AngularJS's directive definition object
Where things go wrong is when using md-checkbox: the ng-model of the checkbox inside the directive is set to true, the md-checkbox is still false. I can confirm that by adding a simple input type="checkbox" with the same ng-model property, the simple checkbox is checked, whereas the md-checkbox isn't.
Whenever I click on the md-checkbox twice, it does get checked. So I gather that there is something wrong with the binding. I built a CodePen which demonstrates it. The code inside the pen is almost taken verbatim from my source code
Stuff that I already tried:
Using $scope.$apply() after handling all (DOM) logic in the link function
Idem but with $scope.$digest()
Setting a $timeout with no delay (as way of a 'safe' $apply())
Even going so far as to store the current answer (true or false) in a variable, setting the ng-model property to undefined, and then setting it back to the stored value, all inside a $timeout
I'm at loss here, it looks like something simple given the fact that all the other inputs have their correct data in it.
Replace class with ng-class because ng-class lets you to dynamically bind the class to the element
Depending on your codepen the problem is class="md-checkbox-{{expression}}". I forked your codepen. You can use ng-class. I think this is a bug.
I am binding an object from my controller on a directive in that controller. I can update fields from the directive on ngModel, however I cant seem to add or delete items from an existing property of type Array on that ngModel. It doesnt reflect on the value assigend to ngModel on the controller.
Editing a simple (existing) property of type Number or String is possible.
Could use some guidance on this.
If you could show some of your code, it would be helpful. However, from what you describe, I suspect it might be possible that you are not referencing either the array or the elements in the array correctly.
I have an ng-grid that utilizes the showSelectionCheckbox: true property with a custom checkboxCellTemplate.
If I remove checkboxCellTemplate I get the functionality I want where only one checkbox can be clicked at a time and clicking another checkbox will remove the selection from the previous one.
I need the template to call a specific function so my question comes down to what property to I have to pass in the template so it can be aware of the multiselect property?
The plunker can be found at http://plnkr.co/edit/nULoI4?p=preview.
So to clarify you're wondering if you can get all the values that are selected when you call a function? Don't you already have this setup in the $scope.selections. You could pass this in the function of the template by doing something like this ng-click="getDeliveryLocation({{selections}})".
Another thought is that you use afterSelectionChange:function(){} and add in whatever you need instead of the ng-click on the checkmarks. This will remove some of the odd issues you have between the different selects.
I have a ng-repeat and each row has a edit button.
When the user click on the edit button. The row will change it's element using ng-switch
For example:
<div>{{sample.name}}</div>
change to
<input type="text" ng-model="{{sample.name}}">
But I cannot figure out how to switch only the row I clicked.
Here is the not working fiddler
Currently you have only a single global variable selection. One option would be to add a selection variable to each datas entry. Or, you could write a directive with it's own scope (make sure to specify an isolate scope) that handles the switch piece of this- then each scope would have it's own selection.
Your approach wont work, because 'ng-switch-when' accepts only primitive strings and can not be evaluated.
Is ng-model allowed inside element of a table? Will angular automatically update the model if I change a particular column(i.e. view)?
If you are making the table cells directly editable using the HTML contenteditable attribute, ng-model won't work automatically as by default it's only for form elements.
It is possible to make it work with contenteditable though. There is an working example of how to do it on the angular website at http://docs.angularjs.org/api/ng.directive:ngModel.NgModelController
ng-model is allowed wherever typical form elements exist that can use the directive (input, select and textarea)
One thing I will say about ng-model that can make it a bit tricky is that you will want to bind ng-model to a property of an object rather than just a simple scope variable. I have run into several instances where I bind $scope.foo to ng-model and use it in an input control. Then, if you clear the input field, the binding is lost and it stops updating the variable. Use something like $scope.fooObj.modelProp where fooObj is an object and it will work fine.