Issue
I use the following code to add entrys to a knowledgebase, this should be for me and my colleagues, but my Problem is that the entrys are only avaible in the actually session, when I has add them, but when I reload the site, they are lost, can you help me?
My code:
js:
var knowledgebase = angular.module('knowledgebase', []);
///////// --- Start of Data Simulation --- //////////
knowledgebase.controller('kbControl', function ($scope, $sce, $http) {
$scope.tutorials = [
{
'topic': 'Oracle Metalink Porsche',
'body': '<a href="https://support.oracle.com/CSP/ui/flash.html">https://support.oracle.com/CSP/ui/flash.html</a',
'tags': 'Oracle,Metalink,Porsche,Login,Zugangsdaten',
'value': '0',
'negative': '0'
},
{
'topic': 'Oracle Metalink',
'body': '<a href="https://support.oracle.com/CSP/ui/flash.html">https://support.oracle.com/CSP/ui/flash.html</a>',
'tags': '',
'value': '0',
'negative': '0'
},
{
'topic': 'Oracle Metalink MLP',
'body': '<a href="https://support.oracle.com/CSP/ui/flash.html">https://support.oracle.com/CSP/ui/flash.html</a>',
'tags': '',
'value': '0',
'negative': '0'
},
];
$scope.predicate = 'topic';
$scope.trust = function (html_code) {
return $sce.trustAsHtml(html_code);
}
$scope.quicklinks = [...];
$scope.experts = [...];
///////// --- End of Data Simulation --- //////////
///////// --- Start of Lync Integration --- //////////
$scope.getID = function (username) {
return username.replace('@', '_').replace('.', '_').replace('.', '_');
};
$scope.showLyncPresencePopup = function (event, userName) {...
};
$scope.getStatus = function (userName) {...
};
$scope.hideShowExperts = false;
$scope.expertSort = function (expert) {...
}
var tutorial;
tutorial = {
'customer': '',
'technology': '',
'topic': '',
'description': ''
}
$scope.submit = function (tutorial) {
$scope.tutorials.push({
'customer': $scope.tutorial.customer,
'technology': $scope.tutorial.technology,
'topic': $scope.tutorial.topic,
'body': $scope.tutorial.description
})
};
});
///////// --- End of Lync Integration --- //////////
///////// --- Data Templates --- //////////
/*
tutorials: {'topic':'','body':'','tags':'','customers':'','technology':''},
quicklinks: {'name':'','address':''},
experts: {'name':'','email':'','customers':'','technologies':''},
html:
<!DOCTYPE html>
<html lang="en" ng-app="knowledgebase">
<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>DB Knowledgebase</title>
<link rel="stylesheet" href="main.css">
<link href="css/bootstrap.min.css" rel="stylesheet">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="angular.min.js"></script>
<script src="kbController.js"></script>
<script src="js/lyncInterconnect.js"></script>
</head>
<body ng-controller="kbControl">
<div class="header maxwid h80 margbot10">
<div id="logo" class="left marg5"></div>
<h1 class="titlehead nomargtop">DB-Team Knowledgebase</h1>
<div id="mobMenu"></div>
</div>
<div class="menu mobHidden left wid20">
<ul class="nostyle nomarg nopad">
<li>
<label>Customer:</label>
<select ng-model="selection">
<option value="">All</option>
<option value="Audi">Audi</option>
<option value="porsche">Porsche</option>
</select>
<label>Technology:</label>
<select ng-model="technology">
<option value="">All</option>
<option value="oracle">Oracle</option>
<option value="mssql">MSSQL</option>
<option value="db2">DB2</option>
</select>
<label>Filter:</label>
<input ng-model="query" class="maxwid">
</li>
<li class="miniinfo">Our knowledgebase consists of {{tutorials.length}} topics</li>
<li class="miniinfo">Currently showing {{filtered.length}} topics</li>
<li>
<ul class="nostyle marg10 pad15 quicklinks">
<li><h4 class="nomarg">Quicklinks:</h4></li>
<li ng-repeat="link in quicklinks"><a class="blacktxt quicklink" href="{{link.address}}" target="_blank">{{link.name}}</a></li>
</ul>
</li>
</ul>
<div id="users" ng-hide="(experts | filter:selection | filter:technology).length == experts.length" ng-show="(experts | filter:selection | filter:technology).length < experts.length">
<div>
<label>Available Colleagues</label>
<ul class="nostyle marg10 pad15">
<li ng-repeat="expert in experts | filter:selection | filter:technology | orderBy: expert.name">
<div id="{{getID(expert.email)}}" class="{{getStatus(expert.email)}}" ng-mouseover="showLyncPresencePopup($event, expert.email)" ng-mouseout="hideLyncPresencePopup()"><span class="user">{{expert.name}}</span></div>
</li>
<li ng-show="(experts | filter:selection | filter:technology).length == 0">No colleagues found that match your current filter criteria</li>
</ul>
</div>
</div>
</div>
<div class="right wid80 lightgraybg topics">
<div class="card margbot10 pad15" ng-repeat="tutorial in filtered = (tutorials | filter:query | filter:selection | filter:technology | orderBy:predicate)">
<h3>{{tutorial.topic}}</h3>
<hr noshade class="cardhr"/>
<p ng-bind-html="trust(tutorial.body)" class="normarg nopad"></p>
<p><span class="votetext green">This was helpful!</span><span class="votetext"> / </span><span class="votetext red">This did not help me</span></p>
</div>
<div class="card margbot10 pad15" ng-show="(tutorials | filter:query | filter:selection | filter:technology | orderBy:predicate) == 0">
<h4>No entry found that match your filter criteria.</h4>
<form>
<label>Customer:</label></br>
<select ng-model="tutorial.customer">
<option value="">All</option>
<option value="Audi">Audi</option>
<option value="porsche">Porsche</option>
</select></br>
<label>Technology:</label></br>
<select ng-model="tutorial.technology">
<option value="">All</option>
<option value="oracle">Oracle</option>
<option value="mssql">MSSQL</option>
<option value="db2">DB2</option>
</select></br>
<label>Topic:</label></br>
<input type="text" maxlength="100" size="49" ng-model="tutorial.topic"/></br>
<label>Description:</label></br>
<textarea rows="4" cols="50" ng-model="tutorial.description">
</textarea></br>
<button type="submit" ng-click="submit()">Add entry</button>
<button type="reset">Reset</button>
</form>
</div>
</div>
</body>
<script>
$(document).ready(function(){
jQuery('#mobMenu').bind('click',function(){
$(this).toggleClass('rotation');
$('.menu').toggleClass('mobHidden');
})
});
</script>
</html>
Solution
If you want to store and share data between browsers you will need a website to store your data. You can save and load data with with angulars AJAX API.
There are many ways to store data on a webserver. But you will need server side code to do that.
Answered By - dusky
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.