Question

我创建了一个复选框，该复选框具有与吸气剂的双向绑定。我没有setter，因为getter将返回过滤列表的结果。

此解决方案在本地运行良好，但部署后出现以下错误“无法设置[object Object]的属性myProperty，该对象在Object.handleEvent中只有吸气剂”

module.exports = function (grunt) {

  grunt.loadNpmTasks('grunt-contrib-uglify-es');

  grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),
    uglify: {
      options: {
        mangle: false,
        banner: '/*! <%= pkg.name %> <%= grunt.template.today("yyyy-mm-dd") %> */\n'
      },
      build: {

        // Change your configuration to this...
        files: [{
          expand: true,
          cwd: 'public/js',
          src: '*.js',
          dest: 'public/build/',
          rename: function (dst, src) {
            return dst + '/' + src.replace('.js', '.min.js');
          }
        }]
      }
    }
  });

  grunt.registerTask('default', ['uglify']);
};

我试图了解发生了什么。当我创建设置器并删除更改事件时，它将在部署后起作用。

<input type="checkbox" class="custom-control-input" id="myId" [(ngModel)]="myProperty" (change)="toggleSelection($event)"/>

public get myProperty(): boolean {
        return this.list.every(function(item: any) {
            return item.selected == true;
        });
    }

toggleSelection(event) {
        this.list.forEach(h => (h.selected = event.target.checked));
    }

现在，我想了解为什么第一个实现在本地有效。在本地，我不需要二传手，但是在部署（构建）后，它需要二传手。

Answer 1

在角度上，绑定的两种方式表示：

该变量更改HTML元素（这是绑定的 get 部分）。
HTML元素更改变量（这是绑定的 set 部分）。

因此，在Angular中以两种方式正确使用绑定是在需要获取和设置时。在我看来，您应该使用单向绑定选项-更改HTML的变量，如下所示：

<input type="checkbox" class="custom-control-input" id="myId"
       [checked]="myProperty" (change)="toggleSelection($event)"/>

public get myProperty(): boolean {
    return this.list.every(function(item: any) {
        return item.selected == true;
    });
}

toggleSelection(event) {
    this.list.forEach(h => (h.selected = event.target.checked));
}

这是Angular概念中的正确方法。

双向装订是否需要二传手？

1 个答案: