标签: data-binding

数据绑定如何在AngularJS框架中工作？

我没有在他们的网站上找到技术细节.当数据从视图传播到模型时,它或多或少清楚它是如何工作的.但是AngularJS如何在没有setter和getter的情况下跟踪模型属性的变化？

我发现有一些JavaScript观察者可以做这项工作.但Internet Explorer 6和Internet Explorer 7不支持它们.那么AngularJS如何知道我改变了例如以下内容并在视图上反映了这一变化？

myobject.myproperty="new value";

我需要将某个JSON字符串转换为Java对象.我正在使用Jackson进行JSON处理.我无法控制输入JSON(我从Web服务中读取).这是我的输入JSON:

{"wrapper":[{"id":"13","name":"Fred"}]}

这是一个简化的用例:

private void tryReading() {
    String jsonStr = "{\"wrapper\"\:[{\"id\":\"13\",\"name\":\"Fred\"}]}";
    ObjectMapper mapper = new ObjectMapper();  
    Wrapper wrapper = null;
    try {
        wrapper = mapper.readValue(jsonStr , Wrapper.class);
    } catch (Exception e) {
        e.printStackTrace();
    }
    System.out.println("wrapper = " + wrapper);
}

我的实体类是:

public Class Student { 
    private String name;
    private String id;
    //getters & setters for name & id here
}

My Wrapper类基本上是一个容器对象,用于获取我的学生列表:

public Class Wrapper {
    private List<Student> students;
    //getters & setters here
}

我一直收到这个错误,"包装"返回null.我不确定缺少什么.有人可以帮忙吗？

org.codehaus.jackson.map.exc.UnrecognizedPropertyException: 
    Unrecognized field …

如何使用RelativeSourceWPF绑定以及不同的用例？

我有这样的枚举:

public enum MyLovelyEnum
{
    FirstSelection,
    TheOtherSelection,
    YetAnotherOne
};

我的DataContext中有一个属性:

public MyLovelyEnum VeryLovelyEnum { get; set; }

我的WPF客户端中有三个RadioButton.

<RadioButton Margin="3">First Selection</RadioButton>
<RadioButton Margin="3">The Other Selection</RadioButton>
<RadioButton Margin="3">Yet Another one</RadioButton>

现在如何将RadioButtons绑定到属性以进行正确的双向绑定？

在Model-View-ViewModel体系结构WPF应用程序中实现ViewModel时,似乎有两个主要选择如何使其成为databindable.我已经看到了DependencyProperty用于View将要绑定的属性的实现,我已经看到了实现的ViewModel INotifyPropertyChanged.

我的问题是我应该何时优先选择其中一个？有任何性能差异吗？将ViewModel依赖项提供给WPF真的是个好主意吗？做出设计决定时还需要考虑什么？

我正在考虑使用ListBox或ListView作为WPF应用程序.似乎要么支持数据绑定和项目模板.我的应用程序有一个简单的项目列表,我打算能够根据用户输入搜索/排序/过滤.数据绑定演示(http://msdn.microsoft.com/en-us/library/ms771319.aspx)使用带有CollectionViewSource的ListBox.

有没有人有哪些控制权可以使用以及何时使用？

可能是愚蠢的问题,但我的html表单有简单的输入和按钮:

<input type="text" ng-model="searchText" />
<button ng-click="check()">Check!</button>
{{ searchText }}

然后在控制器中(从routeProvider调用模板和控制器):

$scope.check = function () {
    console.log($scope.searchText);
}

为什么我在单击按钮时看到视图更新正确但在控制台中未定义？

谢谢!

更新:似乎我已经解决了这个问题(之前不得不提出一些解决方法):只需要将我的属性名称更改searchText为search.text,然后$scope.search = {};在控制器中定义空对象并瞧...不知道为什么它正在工作虽然;]

请将此问题视为严格教育.我仍然有兴趣听到新的答案和想法来实现这一点

TL;博士

我如何使用JavaScript实现双向数据绑定？

数据绑定到DOM

通过数据绑定到DOM,我的意思是,例如,拥有一个a带有属性的JavaScript对象b.然后有一个<input>DOM元素(例如),当DOM元素改变时,a改变,反之亦然(也就是说,我的意思是双向数据绑定).

以下是AngularJS的示意图:

所以基本上我有类似的JavaScript:

var a = {b:3};

然后输入(或其他形式)元素,如:

<input type='text' value=''>

我希望输入的值是a.b值(例如),当输入文本发生变化时,我也想a.b改变.当a.bJavaScript发生变化时,输入会发生变化.

问题

在纯JavaScript中完成此操作的基本技术有哪些？

具体来说,我想要一个很好的答案来参考:

• 如何绑定对象的工作？
• 如何听取表格中的变化可能有效？
• 是否有可能以简单的方式仅在模板级别修改HTML？我想不跟踪HTML文档本身的绑定,而只是跟踪JavaScript(使用DOM事件,并且JavaScript保持对所使用的DOM元素的引用).

我试过了什么？

我是Mustache的忠实粉丝,所以我尝试用它来模板化.但是,当我尝试执行数据绑定本身时遇到了问题,因为Mustache将HTML作为字符串处理,因此在得到结果之后,我没有引用viewmodel中对象的位置.我能想到的唯一解决方法是使用属性修改HTML字符串(或创建DOM树)本身.我不介意使用不同的模板引擎.

基本上,我有一种强烈的感觉,我正在使手头的问题变得复杂,并且有一个简单的解决方案.

注意:请不要提供使用外部库的答案,尤其是那些包含数千行代码的库.我已经使用了(并且喜欢!)AngularJS和KnockoutJS.我真的不想要"使用框架x"形式的答案.最理想的是,我希望未来的读者不知道如何使用许多框架来掌握如何自己实现双向数据绑定.我不希望得到一个完整的答案,而是一个能够理解这个想法的答案.

我有一个窗口中包含的列表(见下文).窗口DataContext有两个属性,Items和AllowItemCommand.

如何获取针对窗口的属性需要解析Hyperlink的Command属性DataContext？

<ListView ItemsSource="{Binding Items}">
  <ListView.View>
    <GridView>
      <GridViewColumn Header="Action">
        <GridViewColumn.CellTemplate>
          <DataTemplate>
            <StackPanel>
              <TextBlock>

                <!-- this binding is not working -->
                <Hyperlink Command="{Binding AllowItemCommand}"
                           CommandParameter="{Binding .}">
                    <TextBlock Text="Allow" />
                </Hyperlink>

              </TextBlock>
            </StackPanel>
          </DataTemplate>
        </GridViewColumn.CellTemplate>
      </GridViewColumn>
    </GridView>
  </ListView.View>
</ListView>

我认为我的应用程序现在变得非常大,太大而无法使用单个ViewModel处理每个View.

所以我想知道创建多个ViewModel并将它们全部加载到一个View中会有多困难.需要注意的是,我还需要能够将X ViewModel数据传递到Y ViewModel数据中,以便各个ViewModel需要能够相互通信或至少相互了解.

例如,我有一个<select>下拉列表,选择下拉列表具有一个选定的状态,允许我在<select>另一个ViewModel 中将所选项目的ID传递给另一个Ajax调用....

在单个视图中处理众多ViewModel的任何要点赞赏:)