我使用的是Angular CLI:9.1.2,Node.12.16.2,操作系统:linux x64版本。12.16.2和操作系统:linux x64版本。我得到以下错误[关闭]

问题描述 投票:0回答:1

我使用的是Angular CLI:9.1.2,Node.12.16.2,操作系统:linux x64版本。12.16.2和操作系统:linux x64版本。我还使用了Angular的登录页面和webphone页面。

webphone.component.html是这样的。

<div class="row cnt">
<audio autoplay width='0' hieght='0' id="audio"></audio>
<div class="col-lg-3">
</div>
<div class="col-lg-4">
<div class="panel panel-primary" id="controls">
<div class='form-group row' id="registration_control" style="margin-top: 10px;margin-left: 0px;margin-right: 0px;" >
<div class='col-lg-9'>
<input type="text" class='form-control b-r-sm' ngStyle="{'background-image': 'url(' + regStatusBackgroundImage + ')'}" [value]="reg_status" id="reg_status" readonly>
</div>
</div>
<div class='form-group row' id="dial_control" style="margin-top: 10px;margin-left: 0px;margin-right: 0px;" >
<div class='col-lg-9'>
<input type="text" style="font-size: x-large;height: 40px;" name="digits" class='form-control form-control-lg p-sm b-r-sm' ngModel="digitsValue" id="digits"/>
</div>
<div class='col-lg-3'>
<button class="btn btn-outline btn-primary btn-block" id="dial" on-click="dialButton();"><i id="dial_icon" class="fa fa-phone" ngClass="{'text-danger' : dialIconTextDanger}"></i> </button>
</div>
</div>

app-routing.module.ts:

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { LoginComponent } from './login/login.component';
import { AdminComponent } from './admin/admin.component';
import { WebphoneComponent } from './webphone/webphone.component';
import { AuthGuard } from './auth.guard';
const routes: Routes = [
  { path: '', pathMatch: 'full', redirectTo: 'login'},
  { path: 'login', component: LoginComponent },
  { path: 'admin', component: AdminComponent, canActivate: [AuthGuard] },
  { path: 'webphone', component: WebphoneComponent },
];
@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }

当我输入 ng serve 命令行上。

 ng serve

我得到了这些错误:

ERROR in srcappwebphonewebphone.component.html:11:53 - error NG8002: 不能绑定到'ngStyle',因为它不是'input'的已知属性。

11 srcappwebphonewebphone.component.ts:7:16 7 templateUrl: '.webphone.component.html', ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~。

在组件 WebphoneComponent 的模板中出现错误。 srcappwebphonewebphone.component.html:21:129 - 错误 NG8002: 不能绑定到'ngModel',因为它不是'input'的已知属性。

21 srcappwebphonewebphone.component.ts:7:16 7 templateUrl: '.webphone.component.html',

在组件 WebphoneComponent 的模板中出现错误。 srcappwebphonewebphone.component.html:24:133 - 错误 NG8002。不能绑定到'ngClass',因为它不是'i'的已知属性。

24

srcappwebphonewebphone.component.ts:7:16

我使用了以下StackOverflow的链接,但对我来说没有用。

https:/forum.ionicframework.comtcant-bind-to-ngstyle-since-it-isnt-a-known-property-ion-navbar-solved73643。

如果有人回答,请告诉我.谢谢.**。

html angularjs angular typescript
1个回答
1
投票

我认为ngClass和ngStyle应该封装在[]里面,因为它们是ngClassngStyle指令的输入。当你的指令和输入的名称相同时,就会用到这一点。

另外,当使用ngModel时,你需要导入 formsModule

import { FormsModule } from '@angular/forms';

[...]

@NgModule({
  imports: [
    [...]
    FormsModule
  ],
  [...]
})
© www.soinside.com 2019 - 2024. All rights reserved.