angular2-template

问题 I use the seed structure as per angular.io get started project. Everything OK so far. Now I wanted to change the top component to have a view from a separated file and I get into troubles. The working code is: import {Component, View} from 'angular2/core'; @Component({ selector: 'my-app', template: '<h1>Angular2</h1>', directives: [] }) export class AppComponent { constructor() { } } Then I change the template to templateUrl like so: templateUrl: 'app.component.html', where I have in this

问题 Ideally I would need to reload / rerender my component's template but if there is a better way to do this I will gladly implement it. Desired behavior: So, I have a component for a menu element. When (in another component) I click an IBO (some sort of 'client', per say) is clicked I need to add (I'm using *ngIf ) a new option in the menu that would be IBO Details and a child list. IBOsNavigationElement component (menu component): @Component({ selector: '[ibos-navigation-element]', template: `

问题 Ideally I would need to reload / rerender my component's template but if there is a better way to do this I will gladly implement it. Desired behavior: So, I have a component for a menu element. When (in another component) I click an IBO (some sort of 'client', per say) is clicked I need to add (I'm using *ngIf ) a new option in the menu that would be IBO Details and a child list. IBOsNavigationElement component (menu component): @Component({ selector: '[ibos-navigation-element]', template: `

问题 I'm trying to create my own Angular 2 Directive for Jquery UI Datepicker. I've seen some different approaches on the internet and in SO as well, but no one achieves the goal that I want to. So this is the code that I have so far: import {Directive, ElementRef, Input, forwardRef} from '@angular/core'; import {ControlValueAccessor, NG_VALUE_ACCESSOR} from "@angular/forms"; declare var $:any; @Directive({ selector: '[date-picker]', providers: [{ provide: NG_VALUE_ACCESSOR,useExisting: forwardRef

问题 Is there a way to make a two way binding input component, that can also have a validation inside the component? What I'm trying to achieve is to have a components that I could line up in my forms as follows: <form #f="ngForm"> <my-form-input [(inputModel)]="name" [inputField]="myFormInputName"></my-form-input> <my-form-input [(inputModel)]="name2" [inputField]="myFormInputName2"></my-form-input> ... <my-form-input [(inputModel)]="lastItem" [inputField]="lastItemName"></my-form-input> </form>

问题 I am working with a project using Material Component in Angular 5. I did update my Visual code but I don't know what happened. I am facing an issue "Type 'ElementRef' is not generic." I have been stuck on this issue since morning. Error in this line _inputElement: ElementRef<HTMLInputElement>; constructor(toggleGroup: MatButtonToggleGroup, _changeDetectorRef: ChangeDetectorRef, _elementRef: ElementRef<HTMLInputElement>, _focusMonitor: FocusMonitor); 回答1: I think the problem could be if your

问题 Is it possible to use <ng-content> (and its select option) inside a <ng-template> or does it only works within a component ? <ng-container *ngTemplateOutlet="tpl"> <span greetings>Hello</span> </ng-container> <ng-template #tpl> <ng-content select="[greetings]"></ng-content> World ! </ng-template> The above code does just render World ! :( Here is the live example 回答1: As far as i know it is not possible using ng-content , but you can provide parameters to the template. So it's possible to

问题 I have this inputs generated dynamically: <div *ngFor="let cell of column; let i = index;"> <!-- Material design input--> <md-input id="my-input-{{i}}"> </md-input> </div> Please notice id=my-input-{{i}} I would like to get a reference to the DOM element based on this dynamic id. This input can be 3, 6 or more inputs so I need to access the id dynamically and get a hold to it. 回答1: The only response is let elem:Element = document.getElementById("myProgrammaticallyChosenIndex") No other

问题 I have this inputs generated dynamically: <div *ngFor="let cell of column; let i = index;"> <!-- Material design input--> <md-input id="my-input-{{i}}"> </md-input> </div> Please notice id=my-input-{{i}} I would like to get a reference to the DOM element based on this dynamic id. This input can be 3, 6 or more inputs so I need to access the id dynamically and get a hold to it. 回答1: The only response is let elem:Element = document.getElementById("myProgrammaticallyChosenIndex") No other

问题 I have some elements I want on every page except the login page. I'd like to use ngIf or possibly the hidden property of the elements to hide those elements when the user is on the login page. I have tried this: <div [hidden]="router.isRouteActive(router.generate('/login'))"> based on this question and answer: In Angular 2 how do you determine the active route? And have also tried this: <div *ngIf="!router.isRouteActive(router.generate('/login'))"> but haven't had any success. For reference