angular2-template

问题 There are similar questions but none of the answers have done the trick for me, so I would appreciate if you don't mark this as duplicate (unless you refer me to answer question that does solve the issue) I have a Array of Objects result:Array<Object>=[]; which is returned with these values: On my template, I would like to sort the response based on count of 'likes' <tr class *ngFor="let media of (result) | orderBy: 'data.likes.count'"> <td> <img src={{media.data.images.standard_resolution

问题 My code is as follow @Component({ selector: 'my-app', template: ` <ul> <li *ngFor = 'let hero1 of heros2'> {{hero1.name}} </li> </ul> `}) export class AppComponent { heros2 : any = [ new heross('lee', 'lee'), new heross('lee1', 'lee1'), ];} class heross{ private name : string; constructor(name : string, details : string){ this.name = name; }} bootstrap(AppComponent); why am I able to access name in the view and displaying name, provided that I have given it private keyword 回答1: If you'll try:

问题 I'm using angular 2.1 and want to dynamically import a template witch is a string from the backend. I already use ComponentFactoryResolver to load dynamically my parent container, now I need to create his content witch can look like this: <my-component> <my-nested-component> <my-nested-component> <my-component> Components are already in my applications, I just need to create them from the template string and load them into the parent. If create components from string template is not possible,

问题 I have created web app using angular4. All pages working properly with routing. The default page is a home page. Slider working perfect in home page When the app is loaded after that slider not working when I go to another page and then coming into a home page. I have loads all external css and js into index.html page. In home component, load just content with slider and some scripts for slider load into the one-night method. Home page works properly when page refresh or load First time

问题 I want to fill an HTML table dynamically with data from a passed in object with Angular. As long as I try to access values on the "first level" of my object, the code works fine. The problem is that I can not access values from nested objects. Anyone have a workaround? table.component.ts: setTable(headers: string[],attributes: string[], obj: any) { this.obj = obj; this.tableHeaders = headers; this.attributes = attributes; } table.component.html: <td *ngFor="let header of tableHeaders; let i =

问题 I have a custom component that applies bootstrap form group to my form fields. In my component I have below properties: import { Component, Input, ContentChild } from '@angular/core'; import { NgControl } from '@angular/common'; @Component({ selector: 'form-field', template: ` <div class="form-group" [ngClass]="{'has-error':(state && !state.valid && state.touched)}"> <label *ngIf="label" [attr.for]="state.name" class="col-sm-3 control-label">{{label}}</label> <div class="col-sm-9"> <ng

问题 I have a main component with routes: @Routes([ { path : "/auth/login", component: AuthComponent }, { path : "/", component: DefaultComponent } ]) DefaultComponent routes: @Routes([ { path : "/", component: LevelListComponent }, { path : "/levels/:id/add", component: LevelListComponent }, { path : "/levels/:id/edit", component: LevelListComponent }, { path : "/scripts", component: ScriptListComponent } ]) When I try to navigate to /scripts I see an error: app.js:44947 EXCEPTION: Error:

问题 This question already has answers here : Min / Max Validator in Angular 2 Final (17 answers) Closed 2 years ago . I tried to use min validation in template form, but it didn't work. How to use it in template form? Thanks for your help. <input type="number" class="form-control" name="srvc_sub_cnt{{i}}" [ngModel]="s?.srvc_sub_cnt" (ngModelChange)="s?.srvc_sub_cnt? s.srvc_sub_cnt=$event:null" required #srvc_sub_cnt="ngModel" pattern="^[0-9]+$" min="1"> <div class="cell table-info" *ngIf="srvc

问题 I came across this problem like many other where you want a col span for tbody instead of just headers given in the PrimeNG Documentation. I tried to use some directives and Javascript to add it programatically. I am demonstrating the code here. I am not sure if this is a universal solution and would work for everybody but this will definitely act as a starter for solution of your problem. 回答1: Create a custom directive: colspan.ts import { Directive, ElementRef } from '@angular/core';

问题 Below is what I have now: <div class="reviews"> <a href="#"> <i *ngIf="product.rating.avgStars >= 1" class="fa fa-star"></i> <i *ngIf="product.rating.avgStars >= 2" class="fa fa-star"></i> <i *ngIf="product.rating.avgStars >= 3" class="fa fa-star"></i> <i *ngIf="product.rating.avgStars >= 4" class="fa fa-star"></i> <i *ngIf="product.rating.avgStars >= 5" class="fa fa-star"></i> <span class="amount">({{product.rating.reviewCount}} Reviews)</span> </a> As you may have guessed, it will repeat a