Как я могу добавить редактируемое текстовое поле на холст, когда мы нажимаем на кнопку с помощью angular5
Как я могу добавить редактируемое текстовое поле на холст, когда мы нажимаем на кнопку, используя только "angular5"
Что я уже пробовал:
Я создал кнопку, используя Bootstrap и я хочу, чтобы кода onclick кнопки "Добавить" в редактируемом текстовом поле, чтобы быть загружены в наш ID определенном положении
onclick fn должен быть только в разделе "использование Angular5"
<название>
Страница Начальной Загрузки
.row { position: relative; } body { background-size: cover; min-width: 100%; } .left { border: 2px dashed black; height: 100vh; width: 100%; } #myCanvas { background:url("https://s10.aconvert.com/convert/p3r68-cdx67/bpvcr-e5c8y.svg"); background-repeat: no-repeat; background-size: inherit; background-size: 900px 368px; } .right { border: 1px dotted red; height: 100vh; width: 100%; position: relative; } .add_text { position: absolute; right: 10px; top: 10px; padding-left: 30px; padding-right: 30px; } .page-header { background-color:#31ac31; min-height: 80; max-height: 100; } img { height: 50; } .square { height: 75px; width: 75px; }
<br> <div> <br> <h>CM Edits <div class="row"> <div class="col-md-1 col-sm-1 col-lg-1"> </div> <div class="col-md-7 col-sm-7 col-lg-7"> </div> <div class="col-md-1 col-sm-1 col-lg-1"> </div> <div class="col-md-3 col-sm-3 col-lg-3"> Add Text </div> </div> <br><br><br> <div class="row"> <div class="col-md-1 col-sm-1 col-lg-1"> </div> <div class="col-md-7 col-sm-7 col-lg-7 left"> <canvas id="myCanvas" width="829" height="500" style="padding-left: inherit"> </div> <div class="col-md-1 col-sm-1 col-lg-1"> </div> <div class="col-md-3 col-sm-3 col-lg-3 right"> right pannel </div> </div> </div>