【问题标题】:dart onscreen Keyboard events飞镖屏幕键盘事件
【发布时间】:2014-06-07 11:02:03
【问题描述】:

我想用 angular.js 在飞镖中制作一个屏幕键盘。 如果按下一个字母,它应该在 html 网站上。

它是如何工作的?

这是我在 index.html 中得到的:

<button on-click="einsController.generateName()"id="z" class="button">Z</button>
<button on-click="einsController.generateName()"id="u" class="button">U</button>
<button on-click="einsController.generateName()"id="i" class="button">I</button>
<button on-click="einsController.generateName()"id="o" class="button">O</button>
<button on-click="einsController.generateName()"id="p" class="button">P</button>
<button on-click="einsController.generateName()"id="a" class="button">A</button>
<button on-click="einsController.generateName()"id="s" class="button">S</button>
<button on-click="einsController.generateName()"id="d" class="button">D</button>
<button on-click="einsController.generateName()"id="f" class="button">F</button>
<button on-click="einsController.generateName()"id="g" class="button">G</button>
<button on-click="einsController.generateName()"id="h" class="button">H</button>
<button on-click="einsController.generateName()"id="j" class="button">J</button>
<button on-click="einsController.generateName()"id="k" class="button">K</button>
<button on-click="einsController.generateName()"id="l" class="button">L</button>
<button on-click="einsController.generateName()"id="y" class="button">Y</button>
<button on-click="einsController.generateName()"id="x" class="button">X</button>
<button on-click="einsController.generateName()"id="c" class="button">C</button>
<button on-click="einsController.generateName()"id="v" class="button">V</button>
<button on-click="einsController.generateName()"id="b" class="button">B</button>
<button on-click="einsController.generateName()"id="n" class="button">N</button>
<button on-click="einsController.increment()"id="m" class="button">M</button>

这是字母应该出现的地方:

   <span id="badgeName">{{einsController.name}}  </span>

这是 dart 文件中的函数:

  String name = '';

    void generateName() {
     name = "Q"; 
}

我还是不明白。我想我需要更改 generateName() 方法中的某些内容。

我想要一个类似这样的 onScreenKeyboard http://code.tutsplus.com/tutorials/creating-a-keyboard-with-css-and-jquery--net-5774

只有我需要使用飞镖代码。

【问题讨论】:

    标签: dart angular-dart dart-html


    【解决方案1】:

    ng-click 指令应该在你点击的按钮上,而不是你想要显示结果的标签上。

    当您使用 ng-click 时,您不需要您的 query('#letter_A').onClick.listen(...,它们具有类似的功能。

    您需要放置控制器 keyboard,以便您的按钮和要显示输出的 &lt;div&gt; 位于应用控制器的标记内。

    尝试一下,如果它不起作用,请使用新代码更新您的问题,我会再看看。

    【讨论】:

    • 我不明白。我尝试了其他一些教程,但我不会为我工作。我想要的是,如果我点击按钮“A”,A 出现,如果我点击“B”,B 出现在一个字段中。
    • 我向github.com/bwu-dart/angular_playground/tree/master/web/keyboard 发布了一个完整的工作示例,我构建它有点不同。 keyboard 是一个组件,但没有 textarea。如果您将textarea 添加为子项(如在我的示例中),则布局应该与原始示例类似。对于这个textarea 需要有id="write"。如果您想将textarea 放在其他地方,则不需要此ID。这些值绑定到控制器(ng-controller="text-ctrl") I added in index.dart. This is necessary for the keyboard` 和 textarea 以连接它们。
    • 这里的一些例子已经过时并且在 DartEditor 中显示错误。键盘示例有效,并使用 Angular 0.10.0 进行了测试。
    • 非常感谢。我会试试这个。谢谢。
    猜你喜欢
    • 2013-02-17
    • 1970-01-01
    • 1970-01-01
    • 2020-07-15
    • 2013-07-03
    • 1970-01-01
    • 1970-01-01
    • 2015-08-15
    • 1970-01-01
    相关资源
    最近更新 更多