I have the following html file. The above is obviously incorrect. What is the correct syntax for my ngIf directive if I want to compare {{selectedMetric}} and a string constant like “option 1″? Answer <div *ngIf=”selectedMetric===’Metric 1′”>Selected first </div> should to the trick to compare a variable against a literal string
Tag: angular
How to set focus on an input that works on IOS supporting devices?
My aim is to set focus on an input via the button click method. I used a template variable, but doing it via component code seems to give the same result. This works as expected on all devices where I tested (MacBook and some mobile devices) whatever the browser is, i.e. Safari, Chrome, Firefox, however it doesn’t work on iOS
(change) vs (ngModelChange) in angular
Angular 1 does not accept onchange() event, it’s only accepts ng-change() event. Angular 2, on the other hand, accepts both (change) and (ngModelChange) events, which both seems to be doing the same thing. What’s the difference? which one is best for performance? ngModelChange: vs change: Answer (change) event bound to classical input change event. https://developer.mozilla.org/en-US/docs/Web/Events/change You can use (change) event
@Input() issues
I’m trying to get data from a variable from another component, but so far it hasn’t been working. The idea is that when I check a checkbox, the variables (Booleans) become true and some things on my page are visible and vice versa. So basically I want the variables from InstellingenComponent to work in AfdelingDetailComponent. With @Input() it’s not working…
Angular 2 Material Input change placeholder dynamically
I want to change the text of the input placeholder dynamically. The console.log already gives the updated string but the interface doesn’t update so there stays the old placeholder. How can I get the Interface to recognize the change? Answer you can change your input placeholder dynamically like this component.ts now you can change somePlaceholder value any where in the
Angular – How do directives “see” template & ViewContainer?
I have a simple component which injects numbers after a delay via custom directive named *appDelay I already know that * is a hint for Angular to de-sugar the syntax into something like I also know that we can Inject components/templates to the viewContainer via : The directive code is : The docs states : To access a ViewContainerRef of
Load JSON content from a local file with http.get() in Angular 2
I’m trying to load a local JSON file with http.get() in Angular 2. I tried something that I found here on Stack Overflow. It looks like this: This is my app.module.ts where I import the HttpModule and the JsonModule from @angular/http: In my component, I import Http and Response from @angular/http. Then I have a function called loadNavItems(), where I try
How to ‘wait’ for two observables in RxJS
In my app i have something like: Then i get two separated results, first of the _personService and then the _documentService. How can I wait for both results before call this.showForm() to finish an then manipulate the results of each one. Answer Last Update: Mar, 2022. RxJS v7: combineLatestWith From reactiveX documentation: Whenever any input Observable emits a value, it
does angular have the “computed property” feature like in vue.js?
I learnt Vue.js first, and now have a project in Angular 4 so I just learnt Angular. I find everything is not that different from Vue except the “Computed Property”. In Vue, I can create a computed property that listens to changes of other properties and run calculations automatically. For example(in Vue 2): The name property will only recalculate when
When am I supposed to call compileComponents, and how am I getting away with not doing so?
The docs for compileComponents unhelpfully state only this: Compile components with a templateUrl for the test’s NgModule. It is necessary to call this function as fetching urls is asynchronous. However, this doesn’t explain in what circumstances is it “necessary” to call this function, nor what the consequences are of not doing so. The app I am currently working on has