我知道这个问题是重复的,但我搜索了很多,我无法解决它,我想在angulrJS App中创建页面,它不会在控制台上呈现任何数据而没有任何错误
这是页面
notebook.html:
<div id="content" class="notebookContent" ng-controller="NotebookCtrl as showCase">
<!-- Include the paragraphs according to the note, pass the note to init function -->
<div id="{{currentParagraph.id}}_paragraphColumn_main"
ng-repeat="currentParagraph in note.paragraphs"
ng-controller="ParagraphCtrl"
ng-init="init(currentParagraph, note)"
ng-class="columnWidthClass(currentParagraph.config.colWidth)"
class="paragraph-col">
<div class="new-paragraph" ng-click="insertNew('above')" ng-hide="viewOnly || asIframe || revisionView">
<h4 class="plus-sign">+</h4>
</div>
<div id="{{currentParagraph.id}}_paragraphColumn"
ng-class="{'paragraph-space box paragraph-margin': !asIframe, 'focused': paragraphFocused,
'lastEmptyParagraph': !paragraph.text && !paragraph.result}"
ng-hide="currentParagraph.config.tableHide && viewOnly"
ng-dblclick="paragraphOnDoubleClick(currentParagraph.id);">
<div id="{{paragraph.id}}_container"
ng-class="{'paragraph': !asIframe, 'paragraphAsIframe': asIframe}">
<div>
<!-- <div ng-if="!paragraph.config.editorHide && !viewOnly" style="margin-bottom:3px;">
<code-editor
paragraph-id="paragraph.id"
paragraph-context="paragraph"
dirty-text="dirtyText"
original-text="originalText"
on-load="aceLoaded"
revision-view="revisionView"
></code-editor>
</div>
-->
<div>
<div id="{{paragraph.id}}_runControl" class="runControl">
<div id="{{paragraph.id}}_progress" class="progress" ng-if="paragraph.status=='RUNNING'">
<div ng-if="getProgress()>0 && getProgress()<100 && paragraph.status=='RUNNING'"
class="progress-bar" role="progressbar" style="width:{{getProgress()}}%;"></div>
<div ng-if="(getProgress()<=0 || getProgress()>=100) && (paragraph.status=='RUNNING' )"
class="progress-bar progress-bar-striped active" role="progressbar" style="width:100%;"></div>
</div>
</div>
</div>
<!-- Rendering -->
<div class="tableDisplay"
ng-show="!paragraph.config.tableHide"
ng-controller="ResultCtrl"
ng-repeat="result in paragraph.results.msg track by $index"
ng-init="init(result, paragraph.config.results[$index], paragraph, $index)"
>
<div>
<div >
<div id="{{id}}_switch"
ng-if="(type == 'TABLE' || apps.length > 0 || suggestion.available && suggestion.available.length > 0) && !asIframe && !viewOnly"
class="result-chart-selector">
<div ng-if="type == 'TABLE'" class="btn-group">
<button type="button" class="btn btn-default btn-sm"
ng-repeat="viz in builtInTableDataVisualizationList track by $index"
ng-class="{'active' : viz.id == graphMode && !config.helium.activeApp}"
ng-click="switchViz(viz.id)"
ng-bind-html="viz.icon">
</button>
</div>
<!-- by walid no effection <div class="btn-group">
<button type="button"
ng-if="type != 'TABLE'"
ng-click="switchApp()"
ng-class="{'active' : !config.helium.activeApp}"
class="btn btn-default btn-sm"><i class="fa fa-terminal"></i>
</button>
<button type="button"
class="btn btn-default btn-sm"
ng-repeat="app in apps"
ng-click="switchApp(app.id)"
ng-class="{'active' : app.id == config.helium.activeApp}"
ng-bind-html="app.pkg.icon">
</button>
</div> -->
</div>
<!-- by walid no effection
<div id="{{paragraph.id}}_helium"
ng-if="(suggestion.available && suggestion.available.length > 0) && !asIframe && !viewOnly"
class="btn-group"
style="margin-bottom: 10px;">
<button type="button"
class="btn btn-default btn-sm dropdown-toggle"
data-toggle="dropdown"
style="font-weight:bold; background-color:#ffdf96; border: 1px solid #FED233">
He
</button>
<ul class="dropdown-menu"
style="z-index:1002"
ng-if="suggestion.available && suggestion.available.length > 0"
role="menu">
<li class="appSuggestion">
<div ng-repeat="pkgInfo in suggestion.available"
style="margin-bottom:5px">
<button type="button"
class="btn btn-default btn-sm"
ng-click="loadApp(pkgInfo.pkg)"
ng-bind-html="pkgInfo.pkg.icon">
</button>
<span class="inline">{{pkgInfo.pkg.name}}</span>
</div>
</li>
</ul>
</div> -->
<div class="btn-group"
ng-if="type == 'TABLE' && !asIframe && !viewOnly"
style="margin-bottom: 10px;">
<button type="button" class="btn btn-default btn-sm"
style="margin-left:10px"
ng-click="exportToDSV(',')"
tooltip="Download Data as CSV" tooltip-placement="bottom">
<i class="fa fa-download"></i>
</button>
<button type="button" class="btn btn-default btn-sm dropdown-toggle caretBtn"
data-toggle="dropdown">
<span class="caret" style="margin: 0px;"></span>
<span class="sr-only">Toggle Dropdown</span>
</button>
<ul class="dropdown-menu" role="menu" style="min-width: 70px;">
<li ng-click="exportToDSV(',')"><a>CSV</a></li>
<li ng-click="exportToDSV('\t')"><a>TSV</a></li>
</ul>
</div>
<span
ng-if="type=='TABLE' && !config.helium.activeApp && graphMode!='table' && !asIframe && !viewOnly"
style="margin-left:10px; cursor:pointer; display: inline-block; vertical-align:top; position: relative; line-height:30px;">
<a class="btnText" ng-click="toggleGraphSetting()">
settings <span ng-class="config.graph.optionOpen ? 'fa fa-caret-up' : 'fa fa-caret-down'"></span>
</a>
</span>
</div>
<div
id="p{{id}}_resize"
ng-if="!config.helium.activeApp"
style="padding-bottom: 5px;"
resize='{"allowresize": "{{!asIframe && !viewOnly}}", "graphType": "{{type}}"}'
resizable on-resize="resize(width, height);">
<div ng-if="type=='TABLE'">
graph setting
<div class="option lightBold" style="overflow: visible;"
ng-show="graphMode!='table'
&& config.graph.optionOpen && !asIframe && !viewOnly">
<div ng-repeat="viz in builtInTableDataVisualizationList track by $index"
id="trsetting{{id}}_{{viz.id}}"
ng-show="graphMode == viz.id"></div>
<div ng-repeat="viz in builtInTableDataVisualizationList track by $index"
id="vizsetting{{id}}_{{viz.id}}"
ng-show="graphMode == viz.id"></div>
</div>
graph
<div id="p{{id}}_graph"
class="graphContainer"
ng-class="{'noOverflow': graphMode=='table'}"
>
<div ng-repeat="viz in builtInTableDataVisualizationList track by $index"
id="p{{id}}_{{viz.id}}"
ng-show="graphMode == viz.id">
</div>
</div>
<div id="{{id}}_comment"
class="text"
ng-if="tableDataComment"
ng-bind-html="tableDataComment">
</div>
</div>
<div ng-if="type == 'TEXT'"
class="plainTextContainer">
<div class="fa fa-level-down scroll-paragraph-down"
ng-show="showScrollDownIcon()"
ng-click="scrollParagraphDown()"
tooltip="Follow Output"></div>
<div id="p{{id}}_text"
style="max-height: {{config.graph.height}}px; overflow: auto"
class="text plainTextContent"></div>
<div class="fa fa-chevron-up scroll-paragraph-up"
ng-show="showScrollUpIcon()"
ng-click="scrollParagraphUp()"
tooltip="Scroll Top"></div>
</div>
<div id="p{{id}}_html"
class="resultContained"
ng-if="type == 'HTML'">
</div>
<div id="p{{id}}_angular"
class="resultContained"
ng-if="type == 'ANGULAR'">
</div>
<img id="{{id}}_img"
ng-if="type == 'IMG'"
ng-src="{{getBase64ImageSrc(result.data)}}" />
</div>
<div ng-repeat="app in apps">
<div id="p{{app.id}}"
ng-show="config.helium.activeApp == app.id">
</div>
</div>
</div>
</div>
<div id="{{paragraph.id}}_error"
class="error text"
ng-if="paragraph.status == 'ERROR'"
ng-bind="paragraph.errorMessage">
</div>
</div>
<div>
<div id="{{paragraph.id}}_control" class="control" ng-show="!asIframe">
<span>
{{paragraph.status}}
</span>
<span ng-if="paragraph.status=='RUNNING'">
{{getProgress()}}%
</span>
<!-- Run / Cancel button -->
<span ng-if="!revisionView">
<span class="icon-control-play" style="cursor:pointer;color:#3071A9" tooltip-placement="top" tooltip="Run this paragraph (Shift+Enter)"
ng-click="runParagraph(getEditorValue())"
ng-show="paragraph.status!='RUNNING' && paragraph.status!='PENDING' && paragraph.config.enabled"></span>
<span class="icon-control-pause" style="cursor:pointer;color:#CD5C5C" tooltip-placement="top"
tooltip="Cancel (Ctrl+{{ (isMac ? 'Option' : 'Alt') }}+c)"
ng-click="cancelParagraph(paragraph)"
ng-show="paragraph.status=='RUNNING' || paragraph.status=='PENDING'"></span>
<!--
<span class="{{paragraph.config.editorHide ? 'icon-size-fullscreen' : 'icon-size-actual'}}" style="cursor:pointer" tooltip-placement="top"
tooltip="{{(paragraph.config.editorHide ? 'Show' : 'Hide')}} editor (Ctrl+{{ (isMac ? 'Option' : 'Alt') }}+e)"
ng-click="toggleEditor(paragraph)"></span>
<span class="{{paragraph.config.tableHide ? 'icon-notebook' : 'icon-book-open'}}" style="cursor:pointer" tooltip-placement="top"
tooltip="{{(paragraph.config.tableHide ? 'Show' : 'Hide')}} output (Ctrl+{{ (isMac ? 'Option' : 'Alt') }}+o)"
ng-click="toggleOutput(paragraph)"></span>
-->
</span>
</div>
</div>
<div ng-if="!asIframe" class="paragraphFooter">
<div ng-show="!paragraph.config.tableHide && !viewOnly"
id="{{paragraph.id}}_executionTime"
class="executionTime" ng-bind-html="getExecutionTime(paragraph)">
</div>
<div ng-if = "paragraph.status === 'RUNNING'" class = "paragraphFooterElapsed">
<div id="{{paragraph.id}}_elapsedTime"
class="elapsedTime" ng-bind-html="getElapsedTime(paragraph)">
</div>
</div>
</div>
</div>
</div>
<div class="new-paragraph" ng-click="insertNew('below');" ng-hide="!$last || viewOnly || asIframe || revisionView">
<h4 class="plus-sign">+</h4>
</div>
</div>
<div style="clear:both;height:10px"></div>
</div>
这是页面中使用的控制器
笔记本控制器
app.controller('NotebookCtrl', NotebookCtrl);
NotebookCtrl.$inject = [
'$scope',
'$route',
'$routeParams',
'$location',
'$rootScope',
'$http',
'websocketMsgSrv',
'baseUrlSrv',
'$timeout',
'ngToast',
'noteVarShareService',
'TRASH_FOLDER_ID' ,
'saveAsService',
'noteActionSrv'
];
function NotebookCtrl($scope, $route, $routeParams, $location, $rootScope,
$http, websocketMsgSrv, baseUrlSrv, $timeout,
ngToast, noteVarShareService,saveAsService, noteActionSrv,TRASH_FOLDER_ID) {
///
}
段落控制器
'use strict';
app.controller('ParagraphCtrl', ParagraphCtrl);
ParagraphCtrl.$inject = [
'$scope',
'$rootScope',
'$route',
'$window',
'$routeParams',
'$location',
'$timeout',
'$compile',
'$http',
'$q',
'websocketMsgSrv',
'baseUrlSrv',
'ngToast',
'saveAsService',
'noteActionSrv',
'noteVarShareService'
];
function ParagraphCtrl($scope, $rootScope, $route, $window, $routeParams, $location,
$timeout, $compile, $http, $q, websocketMsgSrv,
baseUrlSrv, ngToast, saveAsService,noteActionSrv,noteVarShareService) {
//
}
结果控制器
app.controller('ResultCtrl', ResultCtrl);
ResultCtrl.$inject = [
'$scope',
'$rootScope',
'$route',
'$window',
'$routeParams',
'$location',
'$timeout',
'$compile',
'$http',
'$q',
'$templateRequest',
'$sce',
'websocketMsgSrv',
'baseUrlSrv',
'ngToast',
'noteActionSrv',
'saveAsService',
'noteVarShareService',
'heliumService'
];
function ResultCtrl($scope, $rootScope, $route, $window, $routeParams, $location,
$timeout, $compile, $http, $q, $templateRequest, $sce, websocketMsgSrv,
baseUrlSrv, ngToast,noteActionSrv,saveAsService,noteVarShareService, heliumService) {
////
}
这就是路由
report-state.js
.state('app.reports.zepplien', {
url: '/notebook/:noteId',
templateUrl: 'views/tmpl/reports/notebook.html',
resolve: {
translatePartialLoader: ['$translate', '$translatePartialLoader', function ($translate, $translatePartialLoader) {
$translatePartialLoader.addPart('commons');
$translatePartialLoader.addPart('menu');
$translate.refresh();
return $translate.refresh();}],
}
})
nav.html
<a ui-sref="app.reports.zepplien({noteId: '2CBB836VW'})">
<fa name="fa fa-sitemap"></fa>
<span>DashBoard</span></a>
任何人都可以知道这个问题吗?
答案 0 :(得分:1)
我发现了问题,ng-repeat中的第一个列表在后端是空的