Question

修改对象的内部属性后，如下所示

<Window x:Class="NoValueItem.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:NoValueItem"
        mc:Ignorable="d"
        Title="MainWindow" Height="300" Width="300">
    <Grid d:DataContext="{d:DesignInstance local:ViewModel}" VerticalAlignment="Center">
        <Grid.Resources>
            <local:Person x:Key="NullPerson">
                <local:Person.Id>0</local:Person.Id>
                <local:Person.Name>No Person</local:Person.Name>
            </local:Person>
            <local:NullSubstituteConverter x:Key="NullSubstituteConverter"/>
        </Grid.Resources>
        <Grid.DataContext>
            <local:ViewModel/>
        </Grid.DataContext>
        <ComboBox ItemsSource="{Binding ListOfPersons}"
                  SelectedItem="{Binding SelectedPerson,
                  Converter={StaticResource NullSubstituteConverter},
                  ConverterParameter={StaticResource NullPerson}}">
            <ComboBox.ItemTemplate>
                <DataTemplate>
                <TextBlock DataContext="{Binding Converter={StaticResource NullSubstituteConverter},
                           ConverterParameter={StaticResource NullPerson}}"
                           Text="{Binding Name}"/>
                </DataTemplate>
            </ComboBox.ItemTemplate>
        </ComboBox>
    </Grid>
</Window>

未更新与delete this.siteConfig.sites[siteKey].serverIpWhitelist[ip];的列表绑定。

我尝试了ngFor和NgZone.run()，但都没有效果。

我发现更新列表的唯一方法是添加以下行

ChangeDetectorRef.detectChanges()

相当愚蠢，有没有其他方式强制重新渲染组件？

更新：

ngFor通过this.siteConfig = JSON.parse(JSON.stringify(this.siteConfig));

循环对象的属性

KeysPipe

@Pipe({name: 'keys'}) export class KeysPipe implements PipeTransform { transform(value, args:string[]) : any { let keys = []; for (let key in value) { keys.push({key: key, value: value[key]); } return keys; } }看起来像ngFor

Answer 1

你可以使你的管道不纯净。

@Pipe({name: 'keys', pure: false})

这样，无论是否发生变化，每次更改检测运行时都会调用管道。你应该确保管道工作有效，因为这种方式经常被调用。

Angular2：当对象的内部属性发生更改时重新呈现组件

1 个答案: