标签: 2-way-object-databinding

无法绑定到'ngModel',因为它不是'input'元素的已知属性,并且没有匹配的指令和相应的属性

注意:即时通讯使用alpha.31

import { Component, View, bootstrap } from 'angular2/angular2'

@Component({
    selector: 'data-bind'
})
@View({
    template:`
        <input id="name" type="text" 
            [ng-model]="name" 
            (ng-model)="name = $event" />
        {{ name }}
    ` 
})
class DataBinding { 
    name: string;

    constructor(){
        this.name = 'Jose';
    }
}

bootstrap(DataBinding);

我正在尝试使用react创建一个简单的表单,但是在数据正确绑定到表单的defaultValue时遇到困难.

我正在寻找的行为是这样的:

1. 当我打开我的页面时,文本输入字段应该填入我的数据库中的AwayMessage文本.那就是"示例文本"
2. 理想情况下,如果我的数据库中的AwayMessage没有文本,我想在Text输入字段中有一个占位符.

但是,现在,我发现每次刷新页面时Text输入字段都是空白的.(虽然我在输入中键入的内容确实保存并保持不变.)我认为这是因为输入文本字段的html在AwayMessage为空对象时加载,但在farMessage加载时不刷新.此外,我无法为该字段指定默认值.

为清晰起见,我删除了一些代码(即onToggleChange)

    window.Pages ||= {}

    Pages.AwayMessages = React.createClass

      getInitialState: ->
        App.API.fetchAwayMessage (data) =>
        @setState awayMessage:data.away_message
        {awayMessage: {}}

      onTextChange: (event) ->
        console.log "VALUE", event.target.value

      onSubmit: (e) ->
        window.a = @
        e.preventDefault()
        awayMessage = {}
        awayMessage["master_toggle"]=@refs["master_toggle"].getDOMNode().checked
        console.log "value of text", @refs["text"].getDOMNode().value
        awayMessage["text"]=@refs["text"].getDOMNode().value
        @awayMessage(awayMessage)

      awayMessage: (awayMessage)->
        console.log "I'm saving", awayMessage
        App.API.saveAwayMessage awayMessage, (data) =>
          if data.status == 'ok'
            App.modal.closeModal()
            notificationActions.notify("Away Message saved.")
            @setState awayMessage:awayMessage

      render: ->
        console.log "AWAY_MESSAGE", this.state.awayMessage
        awayMessageText = if this.state.awayMessage then this.state.awayMessage.text else "Placeholder Text"
        `<div …

我附上了我的angular2代码片的plunker.我想从我的JSON打印一个字段但是无法打印,因为最初我的Object是null并且它是通过Promise填充的.

这是我的组件文件

import {Component, NgModule, OnInit} from '@angular/core'
import {BrowserModule} from '@angular/platform-browser'

class MyData {
  xyz : MySubData;
}

class MySubData {
  name : string;
} 
@Component({
  selector: 'my-app',
  template: `
    <div>
      <h2>Hello {{name}}</h2>

      {{abc.xyz.name}}
    </div>
  `,
})
export class App implements OnInit {
  abc : MyData = null;
  constructor() {
    this.name = 'Angular2'
  }

  ngOnInit() {
    setTimeout(() => {
      this.abc = new MyData();
      this.abc.xyz = new MySubData();
      this.abc.xyz.name = "Binita";
    }, 2000);
  }
}

@NgModule({
  imports: [ BrowserModule ], …

这必须是最基本的问题,但经过一整天的阅读教程和文档后,我似乎无法理解在哪里放这些方法.没有一个指南提到放置这个东西的地方,只是提到在静态方法上使用注释.什么静态方法？任何静态方法都可以,无论什么类？什么是好习惯？创建一个CustomBinding类来托管所有这些静态方法？

只要我有方法有一个BindingAdapter注释,第一个参数是一个View,它会起作用吗？

我假设如果第一个参数是View类型我可以将绑定属性放在任何类型的视图上,它会触发方法吗？因此,如果我有特定的视图说EditText,这是否意味着只有在布局文件的EditText视图中找到属性时才调用该方法？

在Angular2(Beta 6)中,我有一个主菜单组件.

<mainmenu></mainmenu>

我想为宽或窄绑定一个布尔值.所以我做到了这个:

<mainmenu [(menuvisible)]="true"></mainmenu>

但我想要的(我认为)是绑定到一个javascript类属性(因为我可能有其他东西需要绑定,但希望通过在组件中使用单个类来整洁).

我收到一个错误

EXCEPTION:模板解析错误:无效的属性名称'menumodel.visible'("

] [(menumodel.visible)] = "menumodel.visible">

如果我尝试使用单个变量而不是类,我会得到:

模板解析错误:解析器错误:意外的标记'='

然而,这(单向绑定？)似乎确实有效(但我可能想触发菜单从另一个组件扩展/缩小,所以觉得这应该是一个双向数据绑定属性):

<menu [vis]="true"></menu>

这是我的菜单组件:

@Component({
    selector: 'menu',
    templateUrl: './app/menu.html',
    providers: [HTTP_PROVIDERS, ApplicationService],
    directives: [ROUTER_DIRECTIVES, FORM_DIRECTIVES, NgClass, NgForm]
})
export class MenuComponent implements OnInit {

    mainmenu: MainMenuVM;

    constructor(private _applicationService: ApplicationService) {
        this.mainmenu = new MainMenuVM();
    }

    // ...ngOnInit, various functions

}

这是我的MainMenu View Model类

export class MainMenuVM {
    public visible: boolean;
    constructor(
    ) { this.visible = true; }
}

我正在尝试创建一个包含图标和文本的菜单,但可以缩小到只显示图标.我将向上发送此事件到父组件以更改菜单旁边的容器位置.触发内容容器以最大化将触发菜单缩小 - 我不是说这是最好的方法,但我想在深入之前解决这个特定的问题.

请注意:我不是在这里数据绑定到输入控件 - 只是数据绑定到组件,然后我可以修改UI.

这是来自Angular …

从技术上讲,数据绑定引擎如何在引擎盖下工作？特别是,数据绑定中"同步器"的机制如何看起来像是什么样的？

在.NET,Java,Flex等许多框架中,它们提供了数据绑定引擎.我一直只是使用API​​调用,所以每件事对我来说都很容易,因为我所要做的就是调用API.

现在,我有兴趣尝试为我正在研究的游戏编写一个相对简单的数据绑定引擎.虽然我正在使用C#,但我有理由无法使用内置的WinForms和数据绑定引擎(请参阅下面的背景信息).由于我不能在C#中使用现有的数据绑定引擎,我想我可能必须自己编写一个.因此,我需要了解数据绑定通常如何工作的细节.这样,我不是指如何在C#中使用数据绑定.我的意思是,数据绑定如何在内部和架构上工作.

我试图在网上搜索有关数据绑定的教程和文章,但大多数结果都是我在C#中使用现有数据绑定的原因,这不是我想要的.

所以,在我开始计划编写自己的数据绑定器之前,我想我需要知道数据绑定引擎是如何工作的？更重要的是,数据绑定引擎中"同步器"的机制如何看起来和工作如何,即数据如何在单向或双向绑定中始终保持同步？

为什么我问这个问题的一些背景信息:

不久之前,我提出了一个问题,即我如何在C#中使用不使用标准WinForms的UI进行数据绑定.我得到的答案是C#中的数据绑定引擎与WPF/Windows Forms UI紧密耦合.所以,我想我不能在C#中使用现有的数据绑定引擎,并且可能必须自己创建一个.这个目的是为了一场比赛,我正在努力.游戏通常有自己的自定义UI(非WinForm).我的目的是为游戏中的UI和游戏对象设置类似MVVM的设计.

我知道Angular2没有双向数据绑定,但有没有办法模仿Angular1.x的双向数据绑定行为？

我正在尝试新的Android数据绑定库(1.0-rc1),我创建了一个带有三个字符串字段(名称,电子邮件和年龄)的User对象,并将它们链接到我的布局中的3个EditTexts.

在第一个字段(名称)上放置了一个TextWatcher.一切似乎都运作良好.我通过在允许它调用setName之前检查文本是否不同来阻止名称字段中的notifyPropertyChanged循环.

问题是,每次输入名称字段时,光标会在每个字符后重置为EditText的左侧.我搜索了一个解决方案但大多数光标问题的修复建议说要抓取对EditText的引用并手动调整光标位置.但是我想避免这样做,因为我需要在EditText中找到ViewByID,而数据绑定的目的是试图避免这样做.谢谢您的帮助.

我的布局看起来像这样:

<layout>

<data>
    <variable name="user" type="com.carlpoole.databindingstest.User"/>
</data>

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:bind="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
    android:layout_height="match_parent" android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity">

    <EditText
        android:layout_width="200dp"
        android:layout_height="wrap_content"
        android:id="@+id/name"
        android:text="@{user.name}"
        bind:addTextChangedListener="@{user.nameChanged}"
        />

    <EditText
        android:layout_width="200dp"
        android:layout_height="wrap_content"
        android:id="@+id/email"
        android:layout_below="@+id/name"
        android:text="@{user.email}"/>

    <EditText
        android:layout_width="200dp"
        android:layout_height="wrap_content"
        android:id="@+id/age"
        android:layout_below="@+id/email"
        android:text="@{user.age}"/>

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/age"
        android:text="@{user.name}"/>

</RelativeLayout>

我的用户对象如下所示:

import android.databinding.BaseObservable;
import android.databinding.Bindable;
import android.text.Editable;
import android.text.TextWatcher;

public class User extends BaseObservable {

    private String name;
    private String email;
    private String age;

    public User(String name, String …

这个问题的背景/上下文: 我有一个WPF桌面应用程序.它使用LINQ to SQL连接到其SQL数据库,并在WPF Datagrids中显示其数据.它的工作还算不错,但性能是一个问题,因为LINQ可能是致命的慢,所以我一直在交换我的逻辑和UI控制从LINQ数据库环境远尽可能,而是它们加载到本地变量,这是非常相似LINQ对象,大大提高了性能.

问题: 当我测试我的Datagrids时,我现在得到一个新的异常" 双向绑定需要Path或XPath. "当我尝试编辑一个Datagrid的某个(整数)列中的值时,尽管编辑字符串列已经工作得很好.我不明白为什么我会这样做,或者该怎么做.

因此,当datagrid.datacontext设置为LINQ实体关联时,它可以工作,但只有当它设置为普通对象列表时才能正常工作.我尝试将列表更改为ObservableCollection,但这没有明显的效果.

我已经在这里和其他网站上查看过十几个不同的相关问题,但我没有看到任何似乎有帮助的问题.

目前我有:

<DataGrid Margin="12,110,12,0" x:Name="dgDays" ItemsSource="{Binding}" 
                 Height="165" VerticalAlignment="Top" MinHeight="0" 
                 AutoGenerateColumns="False"
                 SelectionChanged="dgDays_SelectionChanged">

...

<DataGrid.Columns>
            <DataGridComboBoxColumn Width="80" Header="Cook" x:Name="_DailyCookCombo" SelectedItemBinding="{Binding sCook}"/>
            <DataGridComboBoxColumn Width="80" Header="Eat" x:Name="_DailyDayCombo" SelectedItemBinding="{Binding sDay}"/>
            <DataGridTextColumn Width="52" Header="Prot" Binding="{Binding Protein}" />
            <DataGridTextColumn Width="52" Header="Carb" Binding="{Binding Carb}" />
            <DataGridTextColumn Width="52" Header="Fat" Binding="{Binding Fat}" />
            <DataGridTextColumn Width="62" Header="Prot %" Binding="{Binding ProteinPercent}" />
            <DataGridTextColumn Width="62" Header="Carb %" Binding="{Binding CarbPercent}" />
            <DataGridTextColumn Width="62" Header="Fat %" Binding="{Binding FatPercent}" />
            <DataGridTextColumn Width="116" Header="non PFW meals" Binding="{Binding …

我一直在阅读网络组件,并且对新生规范非常感兴趣.有没有人知道在DOM中是否支持双向数据绑定,而不必使用Polymer？一个例子将不胜感激.