zoukankan      html  css  js  c++  java
  • [Angular 2] Using Array ...spread to enforce Pipe immutability

    Pipes need a new reference or else they will not update their output. In this lesson you will use the Array ...spread operator to create new Array to update pipe output without mutation.

    Currently on our TodoInput.ts, each time you add a new todo into the list, we can see that the TodoModule get updated, but it not showing in the list, this is because Pipes check the reference, it object reference changes then it will update the Pipe. This is good because it can imrpove the prefermence by saving everytime check whether need to update the pipes.

    To make pipe update itself, we need everytime pass in a new reference. So immutable state is required, for example we need to change the current code:

        onSubmit() {
            this.todoService.todos.push(this.todoModule);
            // After insert, create new TodoModule
            this.todoModule = new TodoModule();
            console.log(this.todoService.todos);
        }

    To immutable state:

        onSubmit() {
            this.todoService.addNewTodo(this.todoModule); 
            // After insert, create new TodoModule
            this.todoModule = new TodoModule();
            console.log(this.todoService.todos);
        }
    
    //TodoService.ts:
        addNewTodo(todo){
            this.todos = [...this.todos, todo];
        }

    -----------------------------------

  • 相关阅读:
    Shell需注意的语法问题
    iconv编码转换
    使用cocos创建的项目,如何进行源码调试?
    git切换到远程分支
    在 Git 中 Checkout 历史版本
    JAVA keytool 使用详解
    JAVA调用 keytool 生成keystore 和 cer 证书
    写出好的 commit message
    JAVA
    面试中关于Java你所需知道的的一切
  • 原文地址:https://www.cnblogs.com/Answer1215/p/5303551.html
Copyright © 2011-2022 走看看