账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    angular5 model更新,视图不刷新?
    33
    0

    model是个Array,某个事件需要删除一个元素,通过.splice(index, 1),元素删除了,但是视图不更新;

    2
    打赏
    收藏
    点击回答
        全部回答
    • 0
    • ぐ花葬つ 普通会员 1楼

      在Angular 5中,当模型数据发生变化时,视图需要重新渲染才能更新。这可以通过使用ngFor循环、ngDoCheck指令或者自定义模板来实现。

      以下是一些示例:

      1. 使用ngFor循环:

      ```typescript

      {{ item.name }}

      ```

      1. 使用ngDoCheck指令:

      typescript ngDoCheck(() => { // 检查模型数据是否变化 if (items.length !== items[0].length) { // 如果数据不一致,重新渲染视图 this.items = items.map((item) => item.slice()); } });

      1. 自定义模板:

      ```typescript

      {{ item.name }}

      ```

      请注意,如果数据在组件加载时就已经初始化,那么在某些情况下,可能无法实时更新视图。在这种情况下,可以使用ngOnChanges指令来监听数据变化:

      typescript ngOnChanges(() => { // 检查模型数据是否变化 if (items.length !== items[0].length) { // 如果数据不一致,重新渲染视图 this.items = items.map((item) => item.slice()); } });

      此外,还可以使用setTimeout函数来延时视图的更新:

      typescript setTimeout(() => { // 更新视图 this.items = items.map((item) => item.slice()); }, 1000);

    更多回答
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部