0
Die Datasets-Variable existiert (ich kann es mit console.log() sehen), aber es wird nicht an die HTML-Seite übergeben. Ich habe den Controller und die App richtig eingerichtet, glaube ich, kann aber nicht herausfinden, was ich falsch mache. Anderen Code weggelassen, der keinen Einfluss darauf haben sollte, um das Lesen zu erleichtern. AngularJS kann Variable nicht an HTML-Seite übergeben
<!DOCTYPE html>
<html lang="en" ng-app="ValidationApp">
<body ng-controller="Test1">
<div class="container-fluid" style="position:absolute;">
<div class="btn-group-vertical text-center pull-left">
<h3>Data Visualization</h3>
<button type="button" class="btn-danger" id="visualize" data-toggle='modal' data-target='#d3_choose' onclick="runfile('visualize','')"><i class="fa fa-area-chart"></i> Visualize Results</button><br>
</div>
</div>
<div style="height:70vh;font:16px/26px Georgia, Garamond, Serif ;overflow:auto; background-color:white;padding-top:30px;position:absolute;margin-left:-40px;" class="col-lg-7 col-lg-push-3">
<pre>{{message1}}
</div>
</div>
</div>
<div id="d3_choose" class="modal fade" role="dialog" ">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header" style="background-color:rgba(147, 147, 147, .5);">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title style1" style="font-size:24px;">Choose the Validation results to visualize</h4>
</div>
<div class="modal-body" p>
<!--<form class="form-group" name="file_used" id="file_used">-->
<label ng-repeat="dataset in datasets">Choose a dataset
<input type="radio" ng-value="dataset" value="dataset">
<!--name='results_file' ng-model="results_file" required>-->
{{dataset}}
</label><br>
<h3 ng-show="datasets.length==0">No validation results available using {{folder_name}} folder.</h3><br>
<!--</form>-->
<button type="button" class="btn-danger" id="visualize2" data-toggle='modal' data-target='#d3_viz'
ng-disabled="file_used.$invalid" onclick="data_viz('file_used')"><i class="fa fa-check"></i> Visualize</button>
<button type="button" class="btn btn-danger" data-dismiss="modal">Exit</button>
</div>
</div>
</div>
</div>
$(".modal").on("hidden.bs.modal", function(){
$(".modal-body input").val("")
$(".modal-body select").val("")
});
////////////////////////////////////////
var app=angular.module('ValidationApp',[]);
app.controller('Test1', function($scope,$http) {
//will find current ip address wo hardcoding
var socket = io.connect();
socket.on('messages', function(data) {
if ($scope.message1 == null) {
$scope.$apply(function(){$scope.message1 = data})
} else {
$scope.$apply(function(){$scope.message1 = $scope.message1 += data;})
}
});
socket.on('file_list', function(data) {
$scope.$apply(function() {$scope.folder_name = data[0]})
data.shift()
$scope.$apply(function() {$scope.datasets = data})
});
Möglicherweise müssen Sie einen Dienst erstellen. Siehe https://stackoverflow.com/questions/17747104/how-to-set-scope-of-controller-after-socket-io-message-event-in-angularjs –
Sie haben 2 ng-Apps, die seltsam scheint. – user441521
Die 'message1' -Variable wird jedoch auf der HTML-Seite korrekt angezeigt, daher sollte' $ scope.apply' ausreichend sein. hat den HTML-Code dafür hinzugefügt. – user3711502