Thanks Florian. *The easiest way to make `options` disappear is to use ngIf.* See https://docs.angularjs.org/api/ng/directive/ngIf
In some cases it could be appropriate to use ng-disabled. This will leave the option in the drop down(on chrome) but it will not be selectable by the user. Hope this helps, Zohar Jackson On Wednesday, August 14, 2013 7:13:54 AM UTC-5, Florian Ilgenfritz wrote: > > Hi, > > don't know if after six months this is still interesting to anyone, but > this thread turned up in a Google search for me, so I'm gonna reply anyway. > > The problem here is that ng-hide works by setting the CSS display > property to none. This is supported for <option> elements in Firefox, but > not in Chrome, Safari or IE. See related > <http://stackoverflow.com/questions/2324250/style-display-none-doesnt-work-on-option-tags-in-chrome-but-it-does-in-firefo> > > entries > <http://stackoverflow.com/questions/9234830/how-to-hide-a-option-in-a-select-menu-with-css> > > on stackoverflow for this. > > In you case I would suggest using the ng-options directive and filtering > the input to ng-options depending on the currency instead of explicitly > listing the <option>s. > > Hope this helps anyone, > > Florian > > On Thursday, February 14, 2013 11:08:21 AM UTC+1, Žilvinas Urbonas wrote: >> >> Hello, I've encountered some problem when using AngularJS 1.1.2 with >> Google Chrome on Mac OS X. Tested on Safari and Firefox - no such problem >> existed, no problems with Google Chrome either when using Ubuntu. I have >> one control-group (Twitter Boostrap) which has currency ng-model. >> >> <div class="control-group"> >> <label class="control-label" for="currency"> >> {{ 'currency' | i18n }} >> </label> >> <div class="controls"> >> <select ng-model="currency" >> ng-change="currencyChanged()" >> ng-options="currency for currency in currencies" >> class="input-mini" id="currency"> >> </select> >> </div> >> </div> >> >> Depending on the selected currency it should hide or show some options >> from other control group select element: >> <div class="control-group"> >> <label class="control-label" for="residualValue"> >> {{ 'residual-value' | i18n }} >> </label> >> <div class="controls nowrap"> >> <input type="number" ng-model="residualValue" >> class="input-small" id="residualValue"/> >> <select ng-model="residualValueType" >> class="input-mini"> >> <option>%</option> >> <option ng-hide="currency != 'LTL'">LTL</option> >> <option ng-hide="currency != 'EUR'">EUR</option> >> </select> >> </div> >> </div> >> >> But on Google Chrome (only on Mac OS X, not sure for Windows) it doesn't >> seem to take any effect, tried changing ng-hide="currency!='LTL'" to >> ng-show="currency=='LTL'", same problem persisted. Any idea? Maybe I am >> doing something wrong? >> > -- 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.
