我想将我的javascript代码转换为角度....有人可以帮助我吗？我是棱角分明的新手 [英] I want to convert my javascript code to angular....can someone help me, please? I am new to angular
本文介绍了我想将我的javascript代码转换为角度....有人可以帮助我吗？我是棱角分明的新手的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我创建了一个HTML5画布代码来生成矩形块，并在每次单击按钮时使用JavaScript创建一个新块。并且，每次单击块时，都会显示一些数据。此数据存储在本地Web存储（SQLite）中。现在，我已经使用HTMLL5 canvas，JavaScript，JQuery，SQLite完成了所有这些工作。我现在的任务是将整个事物转换成Angular，但我不熟悉它。有人可以帮帮我。
我尝试过：
HTML
I created a HTML5 canvas code to generate rectangular blocks and used JavaScript to create a new block every time a button is clicked. And, every time the block is clicked, some data is displayed. This data is stored in the local web storage (SQLite). Now, I've done all this using HTMLL5 canvas, JavaScript, JQuery, SQLite. I'm now tasked with converting the whole thing into Angular, but I'm unfamiliar with it. Can someone please help me out.
What I have tried:
HTML
<!DOCTYPE html>
<html>
<body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript" charset="utf-8" src="cordova-1.7.0.js"></script>
<br><br>
<script src="myjs.js"></script>
<button type="button" id="button">
Create
</button>
<p id="demo"></p>
<canvas id="test" class="test"></canvas>
<div id = "status" name = "status"></div>
</body>
</html>
Javascript
Javascript
$(document).ready(function(){
var c = document.getElementById("test");
var ctx=c.getContext("2d");
var h=ctx.fillStyle = 'hsl(' + 360 * Math.random() + ', 50%, 50%)';
ctx.fillRect(20, 20, 150, 100);
ctx.font="30px Arial";
ctx.fillText(0,250,75);
ctx.stroke();
var db = openDatabase('mydb', '1.0', 'Test DB', 2 * 1024 * 1024);
var msg;
var j=Math.random()*4;
var k=Math.random()*4;
db.transaction(function (tx) {
tx.executeSql('CREATE TABLE IF NOT EXISTS LOG11 (id,id1)');
tx.executeSql('INSERT INTO LOG11 (id,id1) VALUES (?,?)',[j,k]);
});
c.addEventListener('click', function(event) {
document.getElementById("demo").innerHTML="Transaction id is "+j+"<br />"+"Transaction id is "+k;
});
$('#button').click(function() {
var el = $("#test"),
newone = el.clone(true);
el.before(newone);//This line is added just for styling
});
var i=0;
$('#button').click(function() {
i++;
var j=Math.random()*4;
var k=Math.random()*4;
var e = document.getElementById("test");
var ctx2 = e.getContext("2d");
ctx2.fillStyle = 'hsl(' + 360 * Math.random() + ', 50%, 50%)';
ctx2.fillRect(20, 20, 150, 100);
ctx2.font="30px Arial";
ctx2.fillText(i,250,75 );
ctx2.stroke();
var db = openDatabase('mydb', '1.0', 'Test DB', 2 * 1024 * 1024);
var msg;
db.transaction(function (tx) {
tx.executeSql('INSERT INTO LOG11 (id,id1) VALUES (?,?)',[j,k]);
});
e.addEventListener('click', function(event) {
document.getElementById("demo").innerHTML="Transaction id is "+j+"<br />"+"Transaction id is "+k;
});
});
});
推荐答案
（document）.ready（function（）{
var c = document.getElementById（test）;
var ctx = c.getContext（2d）;
var h = ctx.fillStyle ='hsl（'+ 360 * Math.random（） +'，50％，50％）';
ctx.fillRect（20,20,150,100）;
ctx.font =30px Arial;
ctx .fillText（0,250,75）;
ctx.stroke（）;
var db = openDatabase（'mydb'，'1.0'，'Test DB'，2 * 1024 * 1024）;
var msg;
var j = Math.random（）* 4;
var k = Math.random（）* 4;
db.transaction（function（tx） {
tx.executeSql（'CREATE TABLE IF NOT EXISTS LOG11（id，id1）'）;
tx.executeSql（'INSERT INTO LOG11（id，id1）VALUES（？，？）'，[ j，k]）;
}）;
c.addEventListener（'click'，function（event）{
document.getElementById（demo） .innerHTML =交易ID为+ j +< br />+交易ID为+ k;
}）;
(document).ready(function(){ var c = document.getElementById("test"); var ctx=c.getContext("2d"); var h=ctx.fillStyle = 'hsl(' + 360 * Math.random() + ', 50%, 50%)'; ctx.fillRect(20, 20, 150, 100); ctx.font="30px Arial"; ctx.fillText(0,250,75); ctx.stroke(); var db = openDatabase('mydb', '1.0', 'Test DB', 2 * 1024 * 1024); var msg; var j=Math.random()*4; var k=Math.random()*4; db.transaction(function (tx) { tx.executeSql('CREATE TABLE IF NOT EXISTS LOG11 (id,id1)'); tx.executeSql('INSERT INTO LOG11 (id,id1) VALUES (?,?)',[j,k]); }); c.addEventListener('click', function(event) { document.getElementById("demo").innerHTML="Transaction id is "+j+"<br />"+"Transaction id is "+k; });
（'＃button'）。click（function（）{
var el =
('#button').click(function() { var el =
（＃test），
newone = el.clone（true）;
el.before（newone）; //此行仅用于样式化
}）;
var i = 0;
("#test"), newone = el.clone(true); el.before(newone);//This line is added just for styling }); var i=0;
这篇关于我想将我的javascript代码转换为角度....有人可以帮助我吗？我是棱角分明的新手的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
