AngularJS + Jade ng-repeat 不填table

Question

我正在尝试通过 AngularJS 填写 table。我的控制器通过套接字接收数据。

数据看起来像：

[{score: 2, team: 1, kills: 9, assists: 2, deaths: 0}, {score: 2, team: 1, kills: 9, assists: 2, deaths: 0}]

我试图将代码减少到相关的东西，但也许我做错了什么，但 jade 模板通常会渲染。

index.jade

doctype html
html(lang='en', ng-app="app")
  head
    meta(charset='utf-8')
    meta(http-equiv='X-UA-Compatible', content='IE=edge')
    meta(name='viewport', content='width=device-width, initial-scale=1')
    title= title
    // Bootstrap CSS
    link(href='stylesheets/bootstrap.min.css', rel='stylesheet')
    // Socket
    script(src='https://cdn.socket.io/socket.io-1.3.5.js')
    // jQuery
    script(src='http://code.jquery.com/jquery-2.1.3.min.js')
    // Angular
    script(src='https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js')
    script(src='javascripts/controller.js')
    // Main CSS
    link(href='stylesheets/main.css', rel='stylesheet')
  body(ng-controller="controller")
    .content.row
      .col-md-12.data
        .table-responsive
          table.table.table-hover
            thead
              tr
                th Score
                th Kills
                th Assists
                th Deaths
            tbody
              tr(ng-repeat="1 in data")
                td {{1.score}}
                td {{1.kills}}
                td {{1.assists}}
                td {{1.deaths}}
    script(src='javascripts/bootstrap.min.js')

controller.js

var app = angular.module('app', []);
app.controller('controller', function($scope) {
    var socket = io('http://localhost:8080');
    socket.on('data', function(data) {
        $scope.data = data;
    });
});

我的控制器接收数据，当我这样做时 console.log($scope.data) 它 returns 我发送的数据。问题一定出在玉模板的某个地方。

Answer 1

在 socket.on('data' 事件中分配数据后，您需要执行 $scope.$apply()。因为通过事件更新范围变量不会运行摘要循环。您需要通过在 $scope 上调用 $apply() 手动运行它，或者您可以将函数包装在 $scope.$apply(function(){ //do scope variable updation from here })

中

代码

var app = angular.module('app', []);
app.controller('controller', function($scope) {
    var socket = io('http://localhost:8080');
    socket.on('data', function(data) {
        $scope.data = data;
        $scope.$apply();
    });
});

AngularJS + Jade ng-repeat 不填table

AngularJS + Jade ng-repeat does not fill the table

angularjs

pug