angular2-directives

问题 I am following Template syntax section for the application of built-in attribute and structural directives from here https://v4.angular.io/guide/template-syntax#ngclass currentClasses: {}; setCurrentClasses() { // CSS classes: added/removed per current state of component properties this.currentClasses = { 'saveable': this.canSave, 'modified': !this.isUnchanged, 'special': this.isSpecial }; } I add currentClasses to my html as per Angular documentation above: <div [ngClass]="currentClasses"

问题 Trying to dive into angular 2 having some experience in angular 1 and having some puzzles. I made one shared module: import { NgModule } from '@angular/core'; import { CommonModule } from '@angular/common'; import { Constants } from './injectables/constants'; import { Utils } from "./injectables/utils"; import { HighlightDirective } from "./directives/highlight"; @NgModule({ imports: [ CommonModule ], declarations: [ HighlightDirective ], providers: [ Constants, Utils ], exports: [

问题 I'm new to Angular 2 and thought I'd make an extendable master-detail flow to start learning. The 'master'-part is working, I can easily plugin the specific service I need to populate the list when bootstrapping the app. The problem lies in making the 'detail'-part extendable. Basically, the master-detail template has the following lines in the template: <div class="large-10 columns"> <detail [item]="masterItemActive" id="detail"></detail> </div> No, I could just load the Detail directive and

问题 I'm using bootstrap-datepicker in my Angular project by creating it as a directive. Below is my code. HTML: <input [datepicker]="datepickerConfig" readonly ngModel name="requestedDate" class="form-control" id="requestedDate" type="text"> Datepicker config in component: datepickerConfig = { format: 'dd-M-yyyy' }; Directive: @Directive({ selector: '[datepicker]' }) export class DatepickerDirective implements OnInit { @Input() datepicker; constructor(private el: ElementRef) { } ngOnInit() { $

问题 I have app.component like this. import {Component} from "angular2/core" import {HTTP_PROVIDERS} from "angular2/http" import {ChartDataService} from '../service/chartData.service' import {FilterService} from "../service/filter.service" @Component({ selector: 'app', template: ` <sidebar (filterChange)="onFilterChange($event)"></sidebar> <div dsChart></div> `, directives: [SidebarComponent, ChartDirective], providers: [HTTP_PROVIDERS, FilterService, ChartDataService], styleUrls: ['app/main/app

问题 I built my app with angular 2 and PrimeNG. I try to use directives on button click for checking user authority. Problem is; if there is no authority, do not continue button click action. But stopPropagation doesn't stop click event. How to stop process if checkAuth() returns false? Blockquote @Directive({ selector: '[checkAuthOnClick]' }) export class CheckAuthorizationOnClickDirective { user: Observable<User>; @Input() allowedClaim: any; observer: MutationObserver; constructor(private

问题 I have created a custom structural directive similar to ngFor . When I try to use it using <template> element syntax, the binding inside the template is working but when I use * syntax, the binding is not working. <!-- working --> <template edit [editOf]="values" let-val="val"> <table > <span>This is using template syntax {{val}}</span> </table> </template> <!-- not working --> <table *edit="let val1 of values"> <span>This uses star syntax {{val1}}</span> </table> Here is the plnkr link for

问题 I've written a very simple little Angular2 app that I've built to generate exercise sheets. However it seems that when I deploy the app ngIf doesn't work (either my ISP default webserver or my own Heroku/local deployed node-http-server). When I run the exact same code base on my dev node server ( npm start ) ngIf works as expected. If anyone has some guidance on how I can debug this I would be extremely grateful, or if I'm just plain doing something wrong... Here's the relevant code src

问题 I recently have started to learn Angular 2 and I am struggling to understand how I should properly connect the changes that occurred in outside world to Angular Reactive Forms. Specifically, I have an issue with the following example: I want to create a directive that enhances input with autocomplete functionality that provided by typeahead jQuery plugin. My directive looks like the following: @Directive({ selector: '[myTypeahead]' }) class TypeAheadDirective implements AfterViewInit {

问题 Can't find any tutorial of how to use angular2-data-table library is here: https://github.com/swimlane/angular2-data-table The documentation seems to be lacking simple examples. Can any one give me a simple example of using datatable in angular2 回答1: I don't recomend using that library for that exact reason. I've been working for a couple of weeks trying to use it in a project and the lack of documentation has made it almost impossible to use. With that being said here is a relativly simple