angular2-directives

问题 Is it possible to have multiple level nesting for angular routing. I am trying to achieve below but it says [Child routes are not allowed for "/cash/..". Use "..." on the parent's route path]. Intended route /storeselector /forms - shows all forms /forms/cash/ - user select cash form from list of forms and on load it will shows all orders /forms/cash/id:1/ shows order details /forms/cash/edit/1 edit order 1 below is my code. app component @Component({ selector : 'forms-app', templateUrl :

问题 I want to use a color picker in angular2. I tried using npm angular2-color-picker library. But i could see only a blank screen after including the directive. (No error found in console). Please help me by knowing where i am going wrong or let me know whether there is any other angular2 library available for color picking.Thanks in advance. My HTML includes: <div> <label>Primary</label> <input [(colorPicker)]="color" [style.background]="color" [value]="color"/> </div> My TS: (AppComponent page

问题 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

问题 I am using the Seriously plugin to display html video onto a canvas element. This works fine for the first visit to the page but when you navigate back the videos all disappear. there is no console errors at all import {Component, ViewChild, ElementRef, OnInit, } from '@angular/core'; import {Observable} from 'rxjs/Observable'; import {RouteTree, CanDeactivate, ROUTER_DIRECTIVES } from '@angular/router'; declare let jQuery: any; declare let Seriously: any; declare let seriously: any; declare

问题 I am learning Angular and am creating components dynamically on the click of a button. I am trying to use Angular Material's drag and drop feature to drag these created components to sort them. I have the following code in my base component html: <div cdkDropList style="margin: 20px" (cdkDropListDropped)="drop($event)"> <div #container></div> </div> And the Typescript code has the following code: @ViewChild('container', {read: ViewContainerRef}) container: ViewContainerRef; const

问题 In my project I am meeting several times the same problem, and yet, I have not been able to find a proper solution. I suspect it is all part of this issue, but it sounds to me like a very normal use case. Many times I have a component with a template such as: <my-component><ng-content></ng-content></my-component> where somewhere in the projected content is trying to get the instance of <my-component> . This simply does not work because the projected component gets resolved before <my

问题 I want to implement autocomplete feature , so an identical option i found was using multi-select drop-down. So i used this module - https://www.npmjs.com/package/ng-multiselect-dropdown But after ditto implementing, i get these errors - Error - ERROR Error: Uncaught (in promise): Error: Template parse errors: Can't bind to 'placeholder' since it isn't a known property of 'ng- multiselect-dropdown'. 1. If 'placeholder' is an Angular directive, then add 'CommonModule' to the '@NgModule.imports'

问题 I'm trying to get an angular directive to repeat inside a <tr> . Without the directive, the code is <tr *ngFor='let cluster of clusters'> <td style='display: flex; flex-direction: column; width: 40%; min-width: 300px;'> <span>{{ cluster.Name }}</span> <span>{{ cluster.StatusMessage }}</span> </td> <td style='width: 100%;'> ... </td> </tr> And looks like When I refactor the directive, I lose the <tr> formatting. The refactored code is <tr *ngFor='let cluster of clusters'> <cluster-row [name]=

问题 As seen in this plunker, I'm dynamically adding an HTML to one of my elements, which boils down to this: @Component({ selector: 'my-comp', template: `<span [innerHTML]="link"></span>`, }) export class MyComponent { private linkContent = '<a routerLink="/my-route">GoTo Route</a>'; private link; constructor(sanitizer: DomSanitizer) { this.link = sanitizer.bypassSecurityTrustHtml(linkContent); } } This results in <a routerLink="/my-route">GoTo Route</a> being added to the DOM, but Angular knows

问题 I have created the login page for the user. If They click the submit button, the page will navigate to one component (test.component.ts,test.component.html,..). I need to make that window in full screen mode. like, (video control full screen in html5). submitLogin() { if (this.userName === 'Student' && this.passWord === 'student@123'){ this.dashboard = true; } else { alert('Incorrect Username or Password'); } } I don't know how to achieve the full screen window functionality. Because, i am