私はangular-uiの単純な使用でさえも起動して実行するのに苦労しています。たとえば、キーの押下を簡単に検出してenter
、[追加]ボタンを押さなくても、テキストボックスを押した後にアイテムを自動的に追加できるようにしたいと考えています。
これが私の現在の試みです:
<!DOCTYPE html>
<html ng-app xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Main</title>
<link rel="stylesheet", href="http://angular-ui.github.com/angular-ui/build/angular-ui.css" />
</head>
<body ng-controller="Ctrl">
<button ng-click="add()">Add</button>
<input type="text" ui-keypress="{enter: 'add()'}" />
{{item}}
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"> </script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.3/angular.min.js"></script>
<script src="http://angular-ui.github.com/angular-ui/build/angular-ui.js"></script>
<script src="main.js"></script>
</body>
</html>
var myApp = angular.module('myApp', ['ui.directives']);
function Ctrl($scope) {
$scope.item = "";
$scope.add = function () {
$scope.item = "Item Added";
}
}
ここで動作を確認できます:http://jsfiddle.net/NbjZL/5/。テキストを入力した後にボタンをクリックすることはできますが、テキストを入力enter
した後に押すことはできません。私は見つけることができるドキュメントを読み、いくつかの例を見てきましたが、まだいくつかの小さなことが欠けていると確信しています。