Erste Schritte mit AngularJS: Erstellen einer einfachen App mit Beispielcode
Hier ist, wie man eine App erstellt, die Zeichen asynchron zählt, mit AngularJS.
Beispielcode
Der folgende Code ist ein AngularJS-Beispiel, das die Zeichenanzahl des eingegebenen Textes in Echtzeit anzeigt. Vergessen Sie nicht, den CDN-Link hinzuzufügen.
<body>
<div ng-app="dev">
<br>
<br>
<div class="container" ng-controller="devCtrl">
<p>Text : <input type="text" ng-model="name"></p>
<pre>
文字数: {{ (name + '').length }}
</pre>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.7.9/angular.min.js"></script>
<script type="text/javascript">
var app = angular.module('dev', []);
app.controller('devCtrl', function($scope) {
$scope.name = '文字を入力してね';
});
</script>
</body>Erklärung
- Wenn Text im
<input>-Element eingegeben wird, wird der eingegebene Wert durchng-model="name"an$scope.namegebunden. - Durch das Schreiben von
{{ (name + '').length }}im<pre>-Tag wird die Länge der$scope.name-Zeichenkette asynchron angezeigt. - Wenn JavaScript-Methoden benötigt werden, können sie auf die gleiche Weise implementiert werden.
Basierend auf diesem Beispiel können Sie verschiedene AngularJS-Funktionen und Anwendungen lernen.