NativeScript 使用 2way 数据绑定

问题描述

我的输入未被接受或由于我的代码正确而出现问题。

在我的 item-detail.component.html 中是这样的代码：

  <StackLayout  class="nt-form chat-wrapper"  >
    <StackLayout id="chat-form" orientation="horizontal" class="nt-input input-field form">
        <TextField [(ngModel)]="usero" width="800px"  class="-rounded-lg input" hint="Nachricht" style="background-color: #ffffff;"></TextField>
        <button width="120px" class="-rounded-lg fa far fas fab" (tap)="sendMessage()" style="margin-left: 15px;" text="&#xf1d8;"></button>
    </StackLayout>
</StackLayout>

我的 item-detail.component.ts 是这个代码：

    import { DatePipe } from "@angular/common";
import { Component,OnInit } from "@angular/core";
import { ActivatedRoute } from "@angular/router";
import { FormatListNumbered } from "@material-ui/icons";
import { RouterExtensions } from "@nativescript/angular";
import { resolveFileNameFromUrl } from "@nativescript/core";
import { connectableObservableDescriptor } from "rxjs/internal/observable/ConnectableObservable";
import { ChatService,DataChat } from "../shared/chat.service";
import { FormControl } from '@angular/forms';

import { UserService,DataUser } from "../shared/user.service";

@Component({
    selector: "ItemDetail",styleUrls: ['item-detail.component.css'],templateUrl: "./item-detail.component.html",providers: [DatePipe]
})
export class ItemDetailComponent implements OnInit {
usero = "";

constructor(){};

sendMessage(): void{
        console.log("usero",this.usero);
       
    }

item-detail.module.ts 是这样的：

import { NativeScriptFormsModule } from "@nativescript/angular";
import { NativeScriptCommonModule } from "@nativescript/angular/common";
import { ItemDetailComponent } from "./item-detail.component";
import { NgModule,NO_ERRORS_SCHEMA } from "@angular/core";

@NgModule({
  imports: [
    NativeScriptFormsModule,NativeScriptCommonModule
  ],declarations: [
    ItemDetailComponent
  ],schemas: [
    NO_ERRORS_SCHEMA
  ]
})
export class ItemDetailModule { }

我的 app.module.ts 是这样的：

import { NgModule,NO_ERRORS_SCHEMA } from "@angular/core";
import { NativeScriptFormsModule,NativeScriptModule } from "@nativescript/angular";
import { FormsModule} from '@angular/forms'

import { AppRoutingModule } from "./app-routing.module";
import { AppComponent } from "./app.component";
import { BrowserModule } from '@angular/platform-browser';

@NgModule({
    bootstrap: [
        AppComponent
    ],imports: [
        FormsModule,BrowserModule,NativeScriptModule,NativeScriptFormsModule,AppRoutingModule,NativeScriptFormsModule
    ],declarations: [
        AppComponent
    ],schemas: [
        NO_ERRORS_SCHEMA
    ]
})
export class AppModule { }

所以我应该做的一切都完成了。但无论出于何种原因它都不起作用，变量为空。

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）