小编Veg*_*ega的帖子

我有一个看起来像这样的表单:

<form class="row" name="powerPlantSearchForm" (ngSubmit)="f.valid && searchPowerPlants()" #f="ngForm" novalidate>
          <div class="form-group col-xs-3" >
            <label for="powerPlantName">PowerPlant Name</label>
            <input type="text" class="form-control-small" [ngClass]="{ 'has-error': f.submitted && !powerPlantName.valid }" name="powerPlantName" [(ngModel)]="model.powerPlantName" #powerPlantName="ngModel" />
          </div>
          <div class="form-group col-xs-3" >
            <label for="powerPlantType">PowerPlant Type</label>
            <select class="form-control" [(ngModel)]="model.powerPlantType" name="powerPlantType">
              <option value="" disabled>--Select Type--</option>
              <option [ngValue]="powerPlantType" *ngFor="let powerPlantType of powerPlantTypes">
                {{ powerPlantType }}
              </option>
            </select>
          </div>
          <div class="form-group col-xs-3" >
            <label for="organizationName">Organization Name</label>
            <input type="text" class="form-control-small" name="powerPlantOrganization" [(ngModel)]="model.powerPlantOrg" #organizationName="ngModel" />
          </div>
          <div class="form-group col-xs-3" >
            <label for="powerPlantStatus">PowerPlant Active Status</label> …

从我的代码开始:

<!-- Edit Column -->
<ng-container mdColumnDef="edit">
  <md-header-cell *mdHeaderCellDef> {{'companies.edit-column' | translate}}</md-header-cell>
  <md-cell *mdCellDef="let element"><a (click)="toCompany(element.id)"><md-icon class="md-dark">edit</md-icon></a></md-cell>
</ng-container>

要求是将编辑图标的位置调整到右侧(关于材料设计的右侧填充)？现在它似乎被强行左对接了.应用style="{text-align: right}" 到md-cell不起作用.

libs版本:

"@angular/material": "2.0.0-beta.10"
"@angular/cdk": "^2.0.0-beta.10",
"@angular/common": "^4.1.3"

当我尝试使用以下命令构建我的应用程序时,我遇到了一个问题:

ionic cordova run android --prod --release

如果我运行如下命令,一切运行正常:

ionic cordova run android

我得到的错误是:

错误:无法确定C:/test/src/pages/cart/cart-items.ts中类CartItemsPage的模块!将CartItemsPage添加到NgModule以修复它.无法确定C:/test/src/pages/items/items.ts中类ItemsPage的模块!将ItemsPage添加到NgModule以修复它.无法在C:/test/src/pages/user-home/user-home.ts中确定类UserHomePage的模块!将用户主页添加到NgModule以修复它.无法确定C语言中的ForgotPasswordPage类的模块:/ test/src/pages/forgot-password/forgot-pas sword.ts!将ForgotPasswordPage添加到NgModule以修复它.无法在C:/test/src/pages/login/login.ts中确定类LoginPage的模块!将LoginPage添加到NgModule以修复它.无法在C:/test/src/pages/signup/signup.ts中确定类SignupPage的模块!将SignupPage添加到NgModule以修复它.无法在C:/test/src/pages/welcome/welcome.ts中确定欢迎页面类的模块!将WelcomePa ge添加到NgModule以修复它.无法在C:/test/src/pages/pincode/pincode.ts中确定PincodePage类的模块!将PincodePa ge添加到NgModule以修复它.无法在C:/test/src/pages/app-home/app-home.ts中确定AppHomePage类的模块!将AppHome页面添加到NgModule以修复它.无法在C:/test/src/pages/profile/profile.ts中确定类ProfilePage的模块!将ProfilePa ge添加到NgModule以修复它.无法在C:/test/src/pages/myorders/order-detail.ts中确定OrderDetailPage类的模块!将OrderDetailPage添加到NgModule以修复它.无法在C:/test/src/pages/myorders/myorders.ts中确定MyOrdersPage类的模块!将MyOrde rsPage添加到NgModule以修复它.无法在C:/test/src/pages/logout/logout.ts中确定类LogoutPage的模块!将LogoutPage添加到NgModule以修复它.无法在C:/test/src/app/app.component.ts中确定MyApp类的模块!将MyApp添加到NgModu文件中以进行修复.无法在C:/test/src/utils/pipes/RemoveUnderscore.ts中确定类RemoveUnderscorePipe的模块!将RemoveUnderscorePipe添加到NgModule以修复它.

但我已将我的所有页面和管道添加到app.module.ts,如下所示:

// Imports

// The translate loader needs to know where to load i18n files
// in Ionic's static asset pipeline.
export function HttpLoaderFactory(http: Http) {
  return new TranslateHttpLoader(http, './assets/i18n/', '.json');
}


let pages:any = [
  MyApp,
  LoginPage,
  UserHomePage,
  SignupPage,
  AppHomePage,
  WelcomePage,
  ItemsPage,
  CartItemsPage,
  ProfilePage,
  MyOrdersPage,
  OrderDetailPage,
  ForgotPasswordPage,
  PincodePage,
  LogoutPage
];

let pipes = [RemoveUnderscorePipe];

export function declarations() {
  return …

这是我点击表格时的UsersList组件.将打开一个新页面

更改用户值并保存后,保存的值不会首次反映在网格中.但是,当我再次进行相同的操作时,它会被反映出来.

以下是我的保存用户代码

import { Component, OnInit } from '@angular/core';
import { Router, ActivatedRoute } from '@angular/router';
import { UserService } from './../../shared/services/user.service';
import {User} from './../../shared/models/user';

@Component({
  selector: 'app-user-add-edit',
  templateUrl: './user-add-edit.component.html',
  styleUrls: ['./user-add-edit.component.css']
})
export class UserAddEditComponent implements OnInit {
   private user: User;
   private id:Number;
  constructor(private userService: UserService, private route: ActivatedRoute,private router: Router) { }

 ngOnInit() {
    this.id = Number(this.route.snapshot.params['id']);
    if (this.id) {
      this.userService.read(this.id).subscribe(
      users => this.user = users,
      err => {
        console.log(err);
      }
    );

     }

 }

 saveUser(){
   this.userService.update(this.user.client,this.user.firstName,this.user.lastName,this.user.id,this.user.key).subscribe( …

目前,已完成步骤的图标是"创建".如何将其更改为其他材质图标行,例如"完成"？

<mat-vertical-stepper>
    <mat-step label="Agreement Preparation">
        <p>Agreement preparion is intiated by our side </p>
    </mat-step>
    <mat-step label="Ready for Biometric">
        <p>Agreement preparion is intiated by our side </p>

    </mat-step>
    <mat-step label="Document in Submission">
        <p>Agreement preparion is intiated by our side </p>

    </mat-step>
</mat-vertical-stepper>

我正在使用Angular 5，并且想要更改占位符文本的颜色。列表中的文本内容可以正常工作（我可以更改颜色），但是占位符却不能。我不是通过应用程序的主要CSS搜索硬编码的解决方案，而是需要通过代码动态地对其进行更改。

<mat-form-field>
    <mat-select placeholder="{{'TXTKEY' | translate }}" [style.color]="config.textColor">
        <mat-option *ngFor="let item of items" [value]="item.identifier" (click)="OnChange(item)">
            <div [style.color]="config.textColor"> {{item.name}}</div>
        </mat-option>
    </mat-select>
</mat-form-field>

使用时<md-icon>出现此错误：

原始异常：没有 Http 提供者！

所以我添加HTTP_PROVIDERS到我的组件中并解决了这个问题。所以我的问题...为什么我需要添加HTTP_PROVIDERS到我的组件才能开始<md-icon>工作，即使我没有HTTP_PROVIDERS在我的应用程序中使用？

这是我的工作组件。从提供者数组中删除HTTP_PROVIDERS会引发上述错误。

import { Component } from '@angular/core';
import { HTTP_PROVIDERS } from '@angular/http';
import { MdIcon, MdIconRegistry } from '@angular2-material/icon';

@Component({
  moduleId: module.id,
  selector: 'foo-app',
  template: `<md-icon>face</md-icon>`,
  directives: [ MdIcon ],
  providers: [MdIconRegistry, HTTP_PROVIDERS]
})
export class FooAppComponent {
  title = 'Material 2 Foo App';
}

另请注意，这一行将显示没有 Http 错误且不需要的图标HTTP_PROVIDERS：

<i class="material-icons">face</i>

我有很多条件来显示相同​​的模板。例如：

<template [ngIf]="item.url.indexOf('http') == -1">
  <a class="ripple-effect" [routerLink]="[item.url]" *ngIf="isUserLoggedIn == true" >             
    <span class="media-body media-middle" *ngIf="isUserLoggedIn == true">{{item.name}}</span>
  </a> 
  <p>Hello, World!</p>
</template>

<template [ngIf]="item.url.indexOf('http') == 0">
  <a class="ripple-effect" [routerLink]="[item.url]" *ngIf="isUserLoggedIn == true" >             
    <span class="media-body media-middle" *ngIf="isUserLoggedIn == true">{{item.name}}</span>
  </a> 
  <p>Hello, World!</p>
</template>

<template [ngIf]="item.url.indexOf('http') == 1">
  <a class="ripple-effect" [routerLink]="[item.url]" *ngIf="isUserLoggedIn == true" >             
    <span class="media-body media-middle" *ngIf="isUserLoggedIn == true">{{item.name}}</span>
  </a> 
  <p>Hello, World!</p>
</template>

<template [ngIf]="item.url.indexOf('http') == 2">
  <a class="ripple-effect" [routerLink]="[item.url]" *ngIf="isUserLoggedIn == true" >             
    <span class="media-body media-middle" *ngIf="isUserLoggedIn == …

我正在尝试在 angular4 中动态添加组件。我检查了其他问题，但找不到解决方案。我收到错误

错误类型错误：无法读取未定义的属性“createComponent”

关于动态组件。

adv.组件.ts

import { Component, OnInit, AfterContentInit, ViewChild, ViewContainerRef, ComponentFactoryResolver } from '@angular/core';
import { SampleComponent } from '../sample/sample.component';
@Component({
  selector: 'app-adv',
  templateUrl: './adv.component.html',
  styleUrls: ['./adv.component.css']
})
export class AdvComponent implements OnInit, AfterContentInit {
  @ViewChild('container', {read:'ViewContainerRef'}) container;
  constructor(private resolver : ComponentFactoryResolver) { }

  ngOnInit() {
  }

  ngAfterContentInit(){
    const sampleFactory = this.resolver.resolveComponentFactory(SampleComponent);
    this.container.createComponent(sampleFactory);
  }

}

adv.component.html

<div #container></div>

应用程序模块.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppComponent } from './app.component'; …

我试图用chart.js绘制一个条形图,它使用多个标签,以便我可以操纵它们.我已经设法用折线图做了,并尝试扩展我在那里做的没有运气.我收到了这个错误.什么可能导致它？

"未捕获的TypeError:在非对象上调用Object.defineProperty".

问题出在数据中的某个地方:{}因为当我将数据作为一个简单的2索引数组时,它运行正常.

编辑:单步执行dataset = null;

        var com_passed = rows[rows.length-2]["# Common Passed"];
        var com_failed = rows[rows.length-2]["# Common Failed"];
        var ctx = document.getElementById("common_chart");
        ctx.height = 50;

        var historicalChart = new Chart(ctx, {
            type: 'bar',
            data: {
                labels: ["Passed", "Failed"],
                datasets: [
                { 
                    data: com_passed,
                    label: "Passed",
                    fillColor: "red"
                },
                { 
                    data: com_failed,
                    label: "Failed",
                    fillColor: "green"                      
                }
                    ]
            },
                options: {
                    scales: {
                        yAxes: [{
                            ticks: {
                            beginAtZero:true,
                            responsive: false,
                            maintainAspectRatio: true
                            }
                        }]
                    }
                }
        });