Question

我是Angular的新手，使用Angular 6。

我尝试通过组件/控制器从输入（数字类型）更新模型。但是，将import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; import { FormsModule, NgModel } from '@angular/forms'; import { AppComponent } from './app.component'; import { CanvasDirective } from './canvas/canvas.directive'; @NgModule({ declarations: [ AppComponent, CanvasDirective ], imports: [ BrowserModule, FormsModule, NgModel ], providers: [], bootstrap: [AppComponent] }) export class AppModule { }导入主应用模块，我收到以下错误消息：

<div appCanvas class="canvas"  (emitConfig)="updateCanvasConfig($event)" [param]="canvasParam"></div>

<ul *ngIf="canvasConfig">
  <li><b>Static Configuration</b></li>
  <li><pre>{{canvasConfig | json}}</pre></li>
  <li><b>Changeable Parameters</b></li>
  <li><pre>{{canvasParam | json}}</pre></li>

  <li>
    <label>
      <div>Amount of points</div>
      <input type="number" [(ngModel)]="canvasParam.points" max="10" min="0" step="1">
    </label>
  </li>
  <li>
    <label>
      <div>Margin X</div>
      <input type="number" [(ngModel)]="canvasParam.margin.x" max="1" min="0" step="0.1">
    </label>
  </li>
  <li>
    <label>
      <div>Margin Y</div>
      <input type="number" [(ngModel)]="canvasParam.margin.y" max="1" min="0" step="0.1">
    </label>
  </li>
  <li>
      <label>
        <div>Stroke Width</div>
        <input type="number" [(ngModel)]="canvasParam.stroke.width" max="10" min="0" step="0.1">
      </label>
    </li>
</ul>

提前感谢您的帮助！

App.Module.ts：

import { Component, OnInit } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { Param } from './models/param.model';
import { Config } from './models/config.model';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent {
  public canvasConfig: Config;
  public canvasParam: Param;
  public test: number;

  constructor() {
    this.canvasParam = {
      colors: {
        start: '#cc0045',
        end: '#0067cc'
      },
      points: 3,
      margin: {
        x: 0.2,
        y: 0.4
      },
      stroke: {
        width: 2
      },
      spread: 80,
      showGrid: true
    };
  }

  changePointCount(e){
    console.log(e.path[0].value);
    this.canvasParam.points = e.path[0].value;
  }

  public updateCanvasConfig(config): void {
    this.canvasConfig = config;
  }
}

app.component.html：

cek = os.urandom(16)
nonce = os.urandom(12)

cipher = AES.new(cek, AES.MODE_GCM, nonce=nonce, mac_len=16)
ciphertext = cipher.encrypt(message)

App.Component.ts：

byte[] nonce = new byte[12];

Cipher cipher = Cipher.getInstance("AES/GCM/NoPadding");
GCMParameterSpec gcmSpec = new GCMParameterSpec(128, iv);
SecretKeySpec secretKeySpec = new SecretKeySpec(cek, "AES");

IvParameterSpec ivParameterSpec = new IvParameterSpec(nonce);
cipher.init(Cipher.DECRYPT_MODE, secretKeySpec, gcmSpec);

byte[] decBytes = mCipher.doFinal(cipherText);

Answer 1

NgModle不是一个模块。它应该是：

imports: [
  FormsModule
]

你已经拥有的

。您也不需要在组件中使用FormsModule，因为它已经注入到应用程序组件中，因此可以在任何地方使用。

Answer 2

除了上述答案外，在App.module.ts的Imports语句中，更改以下行

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

到

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

Angular 6 - ＆＃34;意外指令＆＃39; NgModel＆＃39; ...请添加@NgModule注释＆＃34;

2 个答案: