小编Kam*_*aja的帖子

我是Angular2/TypeScript的新手,所以如果我做了一些愚蠢的错误,请原谅.我想要做的是从选择下拉我使用服务填充数据,这将返回一个JSON数组.

这是我的代码:

product-maintenance.component.ts

import { Component, OnInit} from '@angular/core';
import { ProductMaintenanceService } from '../../_services/product-maintenance.service';
import { ModuleConst } from '../../../data/const';
import { Product } from './product-types';
import { Products } from './products';

@Component({
  selector: 'app-product-maintenance',
  templateUrl: './product-maintenance.component.html',
  styleUrls: ['./product-maintenance.component.css']
})

export class ProductMaintenanceComponent implements OnInit {
 selectedProduct: Product = new Product(0, 'Insurance');
 products: Product[];
 productList: Products[];

 constructor( private productService: ProductMaintenanceService ) {

 }

    ngOnInit() {
      // Dropdown list
      this.products = this.productService.getProductTypeList();
    }
    // Populate data using onSelect method
    onSelect(typeid) …

我是Angular2的新建筑指令.我想要的是创建一个弹出指令,将一些css类包装内容.

内容

内容可以是纯文本和标题,如:

<div class="data">
    <h2>Header</h2>
    Content to be placed here.
</div>

然后我想给它一个指令属性,如:popup

<div class="data" popup>
    <h2>Header</h2>
    Content to be placed here.
</div>

该指令应该做的是将div包装在里面,让我们说:

<div class="some class">
    <div class="some other class">
        <div class="data">
            <h2>Header</h2>
            Content to be placed here.
        </div>
    </div>
</div>

我到目前为止描述的情况,这是一个属性或结构指令.

import { Directive, ElementRef, HostListener, Input } from '@angular/core';

@Directive({
  selector: `[popup]`
})

export class PopupDirective {


}

当我更新模型时,它会抛出"不支持非打开类型中的无类型值".它在更新之前正在工作.无法确定问题的根源.有任何想法吗.

在我的Angular 4组件中,我有类似的东西:

constructor(private route: ActivatedRoute) {
}

ngOnInit() {
  this.myId = this.route.snapshot.params['myId'];
}

而我正在尝试创建一个假设如下的模拟:

class MockActivatedRoute extends ActivatedRoute {
  public params = Observable.of({ myId: 123 });
}    

我的测试失败了:

TypeError:无法读取undefined的属性'params'.

我怎么想嘲笑它？我是否误解了正确的用法,ActivatedRoute应该更好地使用router.subscribe我的组件？我看到一些复杂的例子,人们嘲笑快照本身,但对我来说它看起来过于复杂.

测试本身很简单:

describe('ngOnInit', () => {
it('should set up initial state properly',
  () => {
  const component = TestBed.createComponent(MyComponent).componentInstance;
    component.ngOnInit();
    expect(component.myId).toEqual('123');
  });
});

如果我只是将测试下的方法更改为以下内容 - 测试工作:

ngOnInit() {
    //this.myId = this.route.snapshot.params['myId'];
    this.route.params.subscribe(params => {
    this.myId = params['myId'];
    });
}

显然我需要模拟Activated快照,但是有更好的方法吗？

我正在创建一个Angular组件,它包含一个<button>带有一些附加功能的本机元素.如果它们被禁用并且我想要复制相同的功能,则按钮不会触发单击事件.即给定:

<my-button (click)="onClick()" [isDisabled]="true">Save</my-button>

有没有办法my-button防止onClick()被叫？

在Angular中,您可以通过这种方式监听主机点击事件,并停止传播事件:

//Inside my-button component
@HostListener('click', ['$event'])
onHostClick(event: MouseEvent) {
  event.stopPropagation();
}

这可以防止事件冒泡到祖先元素,但它不会阻止内置(click)输出在同一主机元素上触发.

有没有办法实现这个目标？

编辑1:我现在解决这个问题的方法是使用一个名为"onClick"的不同输出,消费者必须知道使用"onClick"而不是"click".这不是理想的.

编辑2:<button>成功停止源自元素的单击事件.但是如果你像我一样将元素放在按钮标记内,那么单击这些目标上的事件会传播到主机.嗯,应该可以将按钮包裹在另一个停止传播的元素中......

我试图使用子进程模块在python脚本中使用grep命令.

这就是我所拥有的:

userid = 'foo12'
p = subprocess.Popen(['grep', "%s *.log"%userid], stdout=subprocess.PIPE)

它什么也没有回报.我不完全确定我做错了什么,所以有人可以解释一下.我正在使用的当前方法是通过添加shell = true来使其输出正确的输出,但是帮助页面指出它是不安全的.我需要帮助尝试使这项工作,以便我的脚本不安全.

我目前正在处理一个html表单.如何将密码的最小长度设置为8,以便拒绝用户输入的小于8的密码.如何执行此操作？

这是代码:

<div id="login-form">
            <form method="post">
            <table align="center" width="30%" border="0">
            <tr>
            <td><input type="text" name="email" placeholder="Your Email" required /></td>
            </tr>
            <tr>
            <td><input type="password" name="pass" placeholder="Your Password" required /></td>
            </tr>
            <tr>
            <td><button type="submit" name="btn-login">Sign In</button></td>
            </tr>
            <tr>
            <td><a href="register.php">Sign Up Here</a></td>
            </tr>
            </table>
            </form>
        </div>

我在同一个html文件中有下一个组件.

<app-form></app-form>
<app-results [hidden]="isOn"></app-results>
<app-contact-primary [hidden]="!isOn"></<app-contact-primary>
<app-contact-second [hidden]="!isOn"></app-contact-second>

在组件"app-form"中,我有两个按钮:

<button pButton label="Contact" (click)="">Contact</button>
<button pButton label="Results" (click)="">Results</button>

如果我点击按钮"联系"必须显示组件"app-contact-primary"和"app-contact-second"并隐藏"app-results"组件.

但是,如果我点击按钮"结果"必须隐藏组件"app-contact-primary"和"app-contact-second"并显示"app-results"组件.

我怎么能这样做？

谢谢

我正在尝试用角度2创建一个应用程序,并且想要传递params来标记[routerLink]中的一个,我想要像这样的链接:

<a href="/auth/signup?cell=1654654654"></a>

我不知道如何传递cell模板......

我的 Angular 应用程序有几个环境文件：

• 环境.ts
• 环境.dev.ts
• 环境.prod.ts

我想使用所有环境共享的默认变量，而不在每个文件中复制它们。如果我仅在environment.ts 中添加变量“homeUrl” ，例如：

export const environment = {
  production: false,
  apiUrl: 'http://some-backend-url/',
  homeUrl: '/illustrator/directory'
};

当我使用 dev 配置运行应用程序时，environment.dev.ts中的变量已正确加载，但 homeUrl 未定义，因为它仅在environment.ts文件中声明。

有没有办法使用环境之间共享的默认变量而不复制它们？