小编Mos*_*een的帖子

我有一个javascript文件,其中包含一些数据操作函数(根本没有DOM操作),例如浮点舍入,数学运算,等等

我的js文件名为myexample.js就是这样

function example(input) {
  return input * 2
}
module.exports = { example: example }

然后我有我的角度组件example.component.ts

例如:

import { Component, EventEmitter} from '@angular/core';
@Component({
  selector: 'input-number',
  template: `<input 
              type='text' 
              [(value)]='value' 
              (blur)='runExample()' 
             />`,
  inputs: ['value'],
  outputs: ['valueChange']
})
export class Example {
  value: string;
  valueChange = new EventEmitter;

  runExample() {
    let val = parseFloat(this.value);
    // here i need to call example(input) from myexample.js
    // and assign the return to val
    this.valueChange.emit(val);
  }

我现在已经搜索了很长一段时间并试了很多东西,但遗憾的是没有运气.

如果有人可以提供帮助,我将非常感激.

我有一个使用Angular Material的AngularJS应用程序和从外部API加载的数据.

这个应用程序并没有什么特别突破性的,我的所有测试在Chrome,Firefox和Safari中都运行得非常好.

但是,当我使用Internet Explorer时,一切都会破裂.该应用程序非常慢,CSS动画是痛苦的滞后,应用程序完全无法使用.

我花了一天时间尝试了一些潜在的错误修正和调试,但我想成为王牌.

我能看到的东西:

• 当我使用IE11的开发人员工具并运行性能日志时,"样式计算"占用了大部分时间.
• 当我有通配符CSS选择器性能较慢(如*{box-sizing: border-box})

这是性能检查器的输出,我只需向下滚动一个md-virtual-repeat:

正如你所看到的,style calculation这里占用了大量的时间.

谷歌搜索已经取得了成功的解决方案.这里发生了什么？这是一个红色的鲱鱼,问题是我的应用程序中的其他地方(我的JS就像我想到的那样高效,而且我还测试了加载没有真正的数据,只有30个静态对象进入虚拟转发器 - 和结果是​​一样的).

我有一个哈希路由器,从我的主页面路由就好了.当新页面打开时,所有模板语法都被破坏,就会出现问题.这就是所有数据绑定,ngFors,甚至[routerLink].因此页面打开时没有角度逻辑,但是如果我在这些散列页面上刷新浏览器它们工作得很好.

app bootstrap file

import { enableProdMode } from '@angular/core';
import { disableDeprecatedForms, provideForms } from '@angular/forms';
import { HTTP_PROVIDERS } from '@angular/http';
import { bootstrap } from '@angular/platform-browser-dynamic';
import { LocationStrategy, HashLocationStrategy } from '@angular/common';
import { APP_ROUTER_PROVIDERS }  from './path-to-the-router-file';
import { ServerGetService } from './path-to-a-service';
import { AppComponent } from './app/app.component';

// depending on the env mode, enable prod mode or add debugging modules
if (process.env.ENV === 'build') {
  enableProdMode();
}

bootstrap(AppComponent, [
  HTTP_PROVIDERS,
  APP_ROUTER_PROVIDERS,
  {
    provide: …

您好我想创建一个自定义对话框组件,我想以声明方式插入内容,应该如下所示:

app.action.dialog.component.ts:

@Component({
    selector: 'app-action-dialog',
    templateUrl: 'app/template/app.action.dialog.component.html'  
})
export class ActionDialog {

    showing: boolean;

    constructor() {
        this.showing = false;
    }

    show() {
        this.showing = true;
    }

    hide() {
        this.showing = false;
    }
}

app.action.dialog.component.html:

<div id="overlay" class="valign-wrapper" 
    *ngIf="showing" (click)="hide()">
    <div class="container valign">
        <div class="card">
            <div class="card-content">
                <content select="[content]"></content> 
            </div>
        </div>
    </div>
</div>

用法示例:

<app.action.dialog>
    <div content> example </div>
</app.action.dialog>

这不起作用,我该怎么做？可能吗？