Stack Overflow
Stack Overflow

Questions tagged [angular2-template]

For questions referencing Angular Template Syntax including: interpolation, input(property) bindings, output(event) bindings, two-way binding, local variables, star syntax, etc. This tag is specific to angular version 2.x and above

Tag content based loosely off Victor Savkin's Angular Template Syntax article

2881 questions
134
votes
13 answers

How can I use ngFor to iterate over Typescript Enum as an array of strings

I'm using Angular2 and TypeScript and I have an enum: export enum Role { ServiceAdmin, CompanyAdmin, Foreman, AgentForeman, CrewMember, AgentCrewMember, Customer } I want to use *ngFor to iterate over the enum. What is the best way to do…
Rob Gorman
  • 3,502
  • 5
  • 28
  • 45
126
votes
10 answers

NgFor doesn't update data with Pipe in Angular2

In this scenario, I'm displaying a list of students (array) to the view with ngFor:
  • {{student.name}}
    • It's wonderful that it updates whenever I add other student to the list. However, when I give it a pipe to…
    Chu Son
    • 1,520
    • 3
    • 12
    • 13
    119
    votes
    10 answers

    Angular2 disable button

    I know that in angular2 I can disable a button with the [disable] attribute, for example: but can I do it using [ngClass] or [ngStyle] ? Like so:
    111
    votes
    5 answers

    How to implement ngModel on custom elements?

    Given a simple input element I can do this: {{ name }} This doesn't work for my custom elements: How can I implement it?
    user1563700
    108
    votes
    19 answers

    OrderBy pipe issue

    I'm not able to translate this code from Angualr 1 to Angular 2: ng-repeat="todo in todos | orderBy: 'completed'" This is what i've done following the Thierry Templier's answer: Component template: *ngFor="#todo of todos | sort" Component…
    user4956851
    101
    votes
    5 answers

    Angular2 *ngIf check object array length in template

    Refered to https://angular.io/docs/ts/latest/guide/displaying-data.html and stack How to check empty object in angular 2 template using *ngIf still getting syntax error self context undefined. If I remove *ngIf condition then I am getting values in…
    Karthigeyan Vellasamy
    • 2,038
    • 6
    • 33
    • 50
    101
    votes
    8 answers

    Angular2 multiple router-outlet in the same template

    Is it possible to have multiple router-outlet in the same template? If yes then how to configure the routes? I am using angular2 beta.
    Islam Shaheen
    • 1,239
    • 3
    • 11
    • 12
    98
    votes
    3 answers

    How to pass a string value to a component in angular2

    I'd like to pass a string value to a component in angular2, but it doesn't work with the default binding. I'm thinking of something similar to this: Unfortunately, only expressions are allowed on the…
    Andras Hatvani
    • 4,346
    • 4
    • 29
    • 45
    95
    votes
    2 answers

    Pass variable to custom component

    I have my custom component: @Component({ selector: 'my-custom-component', templateUrl: './my-custom-component.html', styleUrls: ['./my-custom-component.css'] }) export class MyCustomComponent { constructor() { …
    rpayanm
    • 6,303
    • 7
    • 26
    • 39
    91
    votes
    13 answers

    Angular 2: How to write a for loop, not a foreach loop

    Using Angular 2, I want to duplicate a line in a template multiple times. Iterating over an object is easy, *ngFor="let object of objects". However, I want to run a simple for loop, not a foreach loop. Something like (pseudo-code): {for i = 0; i <…
    ebakunin
    • 3,621
    • 7
    • 30
    • 49
    89
    votes
    12 answers

    Combine [NgStyle] With Condition (if..else)

    I have read NgStyle Documentation For Angular 2, and it is a little bit confusing for me. How do I use NgStyle with condition like (if...else) to set background image of any element?
    user1294914
    86
    votes
    10 answers

    Angular2 - Focusing a textbox on component load

    I am developing a component in Angular2 (Beta 8). The component has a textbox and a dropdown. I would like to set the focus in textbox as soon as component is loaded or on change event of dropdown. How would I achieve this in angular2. Following is…
    parag
    • 2,483
    • 3
    • 20
    • 34
    82
    votes
    1 answer

    why *ngIf doesnt'work with ng-template?

    I have a condition in the template as follows: