angular2-template

angular 2 rc5 template parse error

房东的猫 提交于 2020-01-02 22:04:15
问题 I keep getting this error when I'm trying to create an angular routing link: zone.js:461 Unhandled Promise rejection: Template parse errors: Can't bind to 'routerLink' since it isn't a known property of 'a'. (" </h1> <button (click)="doLogin()">Login</button> <a [ERROR ->][routerLink]="['/createservice']" href="#">Post a Service</a> <router-outlet></router-outlet> "): AppComponent@4:3 ; Zone: <root> ; Task: Promise.then ; Value: BaseExceptionconsoleError @ zone.js:461 zone.js:463 Error:

Angular4 template reference variable assignment

こ雲淡風輕ζ 提交于 2020-01-02 07:23:24
问题 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? 回答1: 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

Format number of seconds as mm:ss in Angular 2

时光怂恿深爱的人放手 提交于 2020-01-02 00:47:18
问题 I am displaying a number of seconds that counts down from 3600 to 0. <div class="time-box" *ngIf="p.value.playerTimer > 0">{{ p.value.playerTimer }}</div> I would like to format the number of seconds as minutes:seconds I hoped to be able to use DatePipe - https://angular.io/api/common/DatePipe <div class="time-box" *ngIf="p.value.playerTimer > 0">{{ p.value.playerTimer | date:'mmss' }}</div> But this doesn't work as it expects p.value.playerTimer to be a date object or number of seconds since

Angular 2: A property set during OnInit is undefined on the template

牧云@^-^@ 提交于 2020-01-01 17:06:58
问题 I have this component: export class CategoryDetailComponent implements OnInit{ category: Category; categoryProducts: Product[]; errorMessage: string; constructor(private _categoryService: CategoryService, private _productService: ProductService, private _routeParams: RouteParams ) {} ngOnInit() { this.getCategoryAndProducts(); } getCategoryAndProducts() { let categoryName = this._routeParams.get('name'); let categoryId = this.routeParams.get('id'); var params = new URLSearchParams(); params

How to preload angular2 views so will not flicker white page on first load?

对着背影说爱祢 提交于 2020-01-01 10:28:15
问题 I am building an angular 2 app in plain JS. My problem is that when I change from a page to another it flicker a white page until the new view is rendered. This happens for all components only first time I access them. If I go to same route second time the page is loaded without white page. I capture the screen to explain better my problem: https://drive.google.com/file/d/0B5pOsXT-4rdTbmtuVnlUdXRMdE0/view?usp=sharing Here is my main view: <router-outlet></router-outlet> <nav id="menu"> <a

Dynamically bind model and template to at DOM node in Angular 2

喜夏-厌秋 提交于 2020-01-01 05:02:12
问题 Short version This Plunker defines a <view> component which can render an arbitrary model+template. This needs to be changed to replace the previously rendered contents rather than appending new peers. EDIT: This is working now, thanks to the response by user3636086. One problem still remains: unlike Angular 1, Angular 2 forces me to create a nested component to update a template (since templates are effectively a static property of a component's class ), so I have a bunch of unnecessary DOM

Angular2: replace host element with component's template

China☆狼群 提交于 2019-12-31 08:19:09
问题 I'm new to angular in general and to angular2 specifically. I'm trying to write a container component, which should have child components in it. For example, container component : @Component({ selector: 'my-list', template: ` <ul> <ng-content></ng-content> </ul> ` }) export class MyList { } Child component: import { Component } from 'angular2/core' @Component({ selector: 'my-item', template: ` <li> <ng-content></ng-content> </li> ` }) export class MyItem { } I'd like to make this structure:

Angular2 One-way binding form doesn't get cleared after data save

陌路散爱 提交于 2019-12-31 03:46:07
问题 I have a form where inputs are bound to object one-way. <input type="text" name="lastName" #lastName="ngModel" [ngModel]="selectedPers.lastName" required minlength="2"> When saving form I read form data and send it to server, then update my model with dummy/empty data to clear it out. this.peopleListObservable.push(newPersonFormData).then(a => { this.clearPers(); }) clearPers() { this.selectedPers = this.dummyPers; this.isPersAdd = true; } This clear-out method is separate and works when I

how to use jquery in angular 2?

非 Y 不嫁゛ 提交于 2019-12-31 01:48:20
问题 I know if i I need to use 3rd party library in angular 1.3 or 1.4 .I need to make directive of that thing and use that in our project .Now I am using angular 2.0 .I want to make this in angular 2 https://jqueryui.com/autocomplete/ or this https://jsfiddle.net/2rgrmv4q/ can I use jquery in angular2 . 1.How I will use 3rd party library in angular. 2.How I make auto complete of jquery in angular 2. here is my code http://plnkr.co/edit/BxMcNXLjVOJBAIiBGL5Y?p=preview // Code goes here import

how to move div scroll position based on button click in angular 2

谁说胖子不能爱 提交于 2019-12-30 06:47:00
问题 in app.component.html file i have one div element with horizontal scroll and two buttons as Next and Previous. based on these button click i want to move scroll. app.component.html <div id="th-infinite-scroll-tracker" style="overflow-y:scroll; height: 200px;" scrollTracker (scroll)="onScroll($event)" (mouseup)="searchLog($event)"> <div *ngFor="let log of arr; let i = index" innerHTML="{{log}}" [id]="i"></div> </div> <button (click)="onPreviousSearchPosition()" [disabled]="disablePreviousBtn"