双向绑定不会;我不在ES6工作

Two-way binding doesn't work in ES6

本文关键字：ES6 工作 绑定      更新时间：2023-09-26

考虑这个代码

export class TestController {
    constructor() {
        this.socket = io();
        this.movies = {};
        this.socket.emit('getAllMovies', '');
        this.socket.on('allMovies', this.listMovies.bind(this));
    }
    listMovies(data){
        this.movies = JSON.parse(data);
        console.log(this.movies);
    }
}

和查看（使用controllerAs语法）

<div>
{{ctrl.movies}}
</div>

当我打开页面时，它显示｛｝，然后是来自websocket收入的数据（正确），等待this.movies，什么都没有改变。看来双向竞价被打破了。有人知道为什么吗？

问题不在于w/ES6，而是因为角度变化检测机制不知道您的套接字，并且必须运行摘要循环。

看看这个教程。这里的套接字io是用一个服务包装的，该服务在每个套接字事件上手动调用$apply。

app.factory('socket', function ($rootScope) {
  var socket = io.connect();
  return {
    on: function (eventName, callback) {
      socket.on(eventName, function () {  
        var args = arguments;
        //NB!
        $rootScope.$apply(function () {
          callback.apply(socket, args);
        });
      });
    }
  };
});
相关文章：