Ich weiß, dass diese Frage dupliziert ist, aber ich habe viel gesucht und ich kann es nicht lösen, ich möchte Seite in angulrJS App erstellen und es gibt keine Daten ohne Fehler auf der KonsoleangularJS Seite rendern nichts
dieseist die Seite
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>
und dies ist die verwendeten Controller in der Seite
Notebook-Controller
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) {
///
}
Absatz-Controller
'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) {
//
}
Ergebnis-Controller
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) {
////
}
und dies wird Routing
Bericht-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>
kann wissen, jemand das Problem?
sorry für diese leer ist, ich umformatieren es –
haben Sie versuchen gehen ..../Notebook /: noteId? – vict
ja ich mache es statische ID und wenn ich diese Seite öffne es Routing auf die richtige URL 'Berichte/Notebook/2CBB836VW', aber keine Datenanzeige –