angular2-directives

问题 I'm trying to create a parent and child component where the child component is going to have a states drop down. Can someone help me understand how I can access the states drop down value in Parent Component? Here is my sample code. /app/app.ts import {Component} from 'angular2/core' import {FORM_DIRECTIVES, FormBuilder, ControlGroup, Validators} from 'angular2/common' import {State} from './state' @Component({ selector: 'my-app', providers: [FormBuilder], templateUrl: 'app/app.html',

问题 I'm trying to create a parent and child component where the child component is going to have a states drop down. Can someone help me understand how I can access the states drop down value in Parent Component? Here is my sample code. /app/app.ts import {Component} from 'angular2/core' import {FORM_DIRECTIVES, FormBuilder, ControlGroup, Validators} from 'angular2/common' import {State} from './state' @Component({ selector: 'my-app', providers: [FormBuilder], templateUrl: 'app/app.html',

问题 Has anyone gotten Mathjax working with Angular2 ? Plunkr example created :- http://plnkr.co/edit/FLduwmtHfkCN5XPfzMsA?p=preview From some Angular1 examples I saw it looks like a directive is needed to call MathJax.Hub.Queue, but I suspect it will take me quite a while to get the Angular 2 syntax right, so I wondered if anyone has already done it ? e.g the following is an Angular 1 example. https://github.com/ColCarroll/ngMathJax/blob/master/ng-mathjax.js And the mathjax syntax is here :-

问题 What is the difference between Renderer and ElementRef ? In Angular both are used for DOM Manipulation. I am currently using ElementRef alone for writing Angular 2 directives. If I get more info about Renderer , I can use that in my future directives. 回答1: The Renderer is a class that is a partial abstraction over the DOM. Using the Renderer for manipulating the DOM doesn't break server-side rendering or Web Workers (where direct access to the DOM would break). ElementRef is a class that can

问题 i'm trying to teach myself angular2. I trying to build component "trigger-resize", which i want to render as : <a class="hidden-xs" href=""> <em class="fa fa-navicon"></em> </a> and NOT as: <trigger-resize> <a class="hidden-xs" href=""> <em class="fa fa-navicon"></em> </a> </trigger-resize> (i dont want custom selector to render) In angular 1. i know it would be achieved by "replace:true" option, but is it possible to achieve it in angular2? Kind Regards 回答1: One way to do it is to use an

问题 I sometimes have a component that can receive text like this: text www.website.com But I would like to convert it to a url if it is a link. Like this. text www.website.com I read this SO answer that suggests using 3rd party libs such as anchorme. Is there anywway to do it the angular2 way? 回答1: There are numerous problems with using simple regexes to modify HTML content. Here's an approach that uses the linkifyjs module, which you need to npm install . Do notice that the input is considered

问题 I have an ngFor creating rows in a table that is both filtered and paged. <tr *ngFor="#d of data.results | filter:filterText | pagination:resultsPerPage:currentPage"> There is another element on the page that displays the number of records displayed. These elements are initially bound to the data.Results' length. How do I get the length of the data that is displayed after the filter pipe has been applied so that I can display it correctly. None of the provided local variables in ngFor seem to

问题 I'm trying to set the routerLink value in a directive based on a dynamic set of items from the component. But an error is being thrown from Angular2: EXCEPTION: Template parse errors: Parser Error: Got interpolation ({{}}) where expression was expected at column 1 in [ {{item.routerLink}} ] in AppHeader@5:40 (" <a *ngFor="let item of headerItems" [ERROR ->][routerLink]=" {{item.routerLink}} "> {{item.text}} </a> "): Header@5:40 header.component.ts import {Component} from '@angular/core';

问题 I wrote a custom directive that I use in my Angular 2 application to close content panels (some content holders in my template) in all the different components of my Angular 2 application. Since this code is quite the same for each component, I thought that I would make sense to write a directive that I could define once, and use in all components. This is what my directive looks like: import { Directive, ElementRef, HostListener, Injectable } from '@angular/core'; @Directive({ selector: '

问题 I'm developing my first application with Angular 2 and I have installed Augury plugin for Google Chrome, in order to help me debug the code. Here's the components tree and graph: This is the HTML template of my custom component (DocumentsList): <div class="container-fluid" style="margin-top: 10px"> <div class="table-row header"> <div class="column index">#</div> <div class="wrapper attributes"> <div class="wrapper title-comment-module-reporter"> <div class="wrapper title-comment"> <div class=