Question

我尝试使用Meteor / Angular / TypeScript / mongoDB创建一个简单的应用程序。计划是根据数据库中的数据绘制图表。它看起来像这样：

export const Database = new Mongo.Collection('servers');
var app = angular.module('monitor', [

    'chart.js', 
    'angular-meteor', 
    'ui.router'

]);

app.config(['$stateProvider', '$urlRouterProvider',
function($stateProvider, $urlRouterProvider) {

    $urlRouterProvider.otherwise('/login');

    $stateProvider
        .state('login', {
            url: '/login',
            templateUrl: 'client/login.html',
            controller: 'loginCtrl'
        })
        .state('register', {
            url: '/register',
            templateUrl: 'client/register.html',
            controller: 'registerCtrl'
        })
        .state('monitor', {
            url: '/monitor',
            templateUrl: 'client/monitor.html',
            requireLogin: true,
            controller: 'monitorCtrl'
        });
}]);

创建用户，登录，重定向到正确的页面等工作正常，所以我会把这些部分留下来。现在我尝试为数据库集合中的每个对象创建画布。

app.controller('monitorCtrl', ['$scope', '$meteor',
function($scope, $meteor) {

    $scope.servers = $meteor.collection(Database);

    angular.forEach($scope.servers, function(value, key) {

        var canvas = document.createElement('canvas');
        canvas.setAttribute('id', $scope.servers['hostname']);
        canvas.setAttribute('width', '350');
        canvas.setAttribute('height', '250');
        canvas.setAttribute('style', 'border:1px solid #000000');

        document.getElementById('test').appendChild(canvas);
    })
}]);

到目前为止一切顺利。与我的数据库的连接正在运行。当我在HTML网站上显示{{servers}}时，我得到了我的期望。具有一组键/值对的对象数组。看起来像这样：

[{"hostname":"debian",
"ip":"127.0.0.1",
"latency":18.843,
"totalmemory":4156395520,
"usedmemory":1982562304,
"_id":{"_str":"590c2e0332f6128b9300a25f"}},
{"hostname":"dummy1",
"ip":"127.0.0.2",
"latency":"30.000",
"totalmemory":"8392102837",
"usedmemory":"3938462793",
"_id":{"_str":"591558e2155d4e3702f89a05"}},
{"hostname":"dummy2",
"ip":"127.0.0.3",
"latency":"12.000",
"totalmemory":"4873615238",
"usedmemory":"1835263846",
"_id":{"_str":"59155948155d4e3702f89a06"}}]

画布也会被创建，但我不知道如何访问这些对象中某个键的值。画布的ID是＆＃34;未定义＆＃34;。但是我试图让它们成为＆＃39;主机名＆＃39;的价值。为每个对象。我怎么做？我读了一些关于相关问题的主题，但在我看来，我在这里错过了一些简单的基础知识。

Answer 1

传递给函数的值是保存您正在迭代的大数组的当前元素的变量，因此在每次迭代时，它都会变为指向该元素的元素阵列。

试试这个：

 angular.forEach($scope.servers, function(value, key) {
    var canvas = document.createElement('canvas');
    canvas.setAttribute('id', value.hostname);
    canvas.setAttribute('width', '350');
    canvas.setAttribute('height', '250');
    canvas.setAttribute('style', 'border:1px solid #000000');

    document.getElementById('test').appendChild(canvas);
})

Angular - 获取$ scope中某个键的值

1 个答案: