angular2-template

I am pulling data from an API using an Angular 2 service.. I can output everything from the json api onto the page using something similar to this {{ project.title }} however i wish to output the url to a background image and I cant seem to get it working.. has anyone got any ideas or advice ? Currently this is what I have. I've tried it without the curly braces also but nothing is working. <div class="table-wrap featuredimg" [ngStyle]="{'background-image': 'url(' + {{ project.projectimage }} + ')'}"> You don't need use {{}} for call some propiety than you put in a directive, like this: import

I've come across this example where we can see: <md-menu #menu="mdMenu"> I can't find any reference to the ="mdMenu" part of this template in the docs . Is there some meaning to this or is it just a mistake on the example? In the doc [mdMenuTriggerFor]="menu" refers to <md-menu #menu="mdMenu"> and in #menu="mdMenu" , mdMenu is the directive exported from Material. 来源： https://stackoverflow.com/questions/46581046/angular4-template-reference-variable-assignment

In my Angular 2 app, I pass in some data to a PageComponent from my HomeComponent which is then saved to a variable inside the PageComponent. Now when I refresh the page I need this data to be retained. Currently I am using session storage, but I was wondering if there is a better way to implement this. Smit Nope, There isn't a other way in this context. Once you refresh all the temporary memory is gone. As you said you are performing session-storage. You may continue with that. You may choose the below. LocalStorage Cookie Session Difference and importance: How to store token in Local or

I have used below code to access child component HTML element values in parent component during parent component's button click. Child Component.ts:- @Component({ selector: 'child-component', template: `<md-input-container><label>Title</label><input [(ngModel)]="Title" #Title></md-input-container><md-input-container><label>Name</label><input [(ngModel)]="name" #Name></md-input-container><md-input-container class="md-block" flex-gt-sm><label>State</label><md-select [(ngModel)]="user.state" #State><md-option *ngFor="let state in states" value="{{state.abbrev}}">{{state.abbrev}}</md-option></md

So I populate a table with *ngFor and use pipes to filter and order the given items array. This works perfectly and the table rows are created as expected. But I also wan't to use the result of the pipes in my component hosting the table. How can this be achieved with angular2? my current html: <tr *ngFor="#item of items | orderAsc">{{item.name}}</tr> the old angularJS way of saving the result: <tr *ngFor="#item of (result = (items | orderAsc))">{{item.name}}</tr> where "result" could be used in the corresponding controller. What is the angular2 way of achieving this? I'd like to keep the

convert the string to number angular 2 one way binding [longitude]="loc.location.lng"> loc.location.lng is string i need to convert them to number.but still not working as I expect. In interpolation it's working but in this not working. Thanks Make a function which convert the value to float as its location and return the value. ConvertString(value){ return parseFloat(value) } Call the function in template [longitude]="ConvertString(loc.location.lng)" You could also force the cast by trying this: [longitude]="+loc.location.lng" Since you havent provided your source code, its difficult to help

I have a NgSwitch template. In the NgSwitch I want to get a template reference to the initialized template. Something like this: <div class="container" [ngSwitch]="model.type"> <first-component #ref *ngSwitchCase="0"></first-component> <second-component #ref *ngSwitchCase="1"></second-component> <third-component #ref *ngSwitchCase="2"></third-component> </div> When clicking on a button in the component I want to call to the initialized component (first/second/third) to a method (which defined on an interface that all these 3 component implement). The problem is the ViewChild is undefined. If I