W tym wpisie pokażę jak zrobić prosty formularz w AngularJS, który będzie podpięty do listy z danymi. Wartości z pól tekstowych będą przepisywane automatycznie w miejsce wynikowe poprzez listę. Weźmy szablon aplikacji z wpisu, w którym był omówiony kontroler. Będzie to nasz punkt wyjściowy do rozbudowy aplikacji. index.html
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
<!DOCTYPE html> <html ng-app="myApp"> <head> <meta charset="UTF-8"> <title>Hello World AngularJS</title> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular.min.js"></script> <script src="controller.js"></script> </head> <body ng-controller="myCtrl"> <h2>Hello World AngularJS</h2> <input type="text" ng-model="myText"> {{myResult()}} </body> </html> |
controller.js
|
1 2 3 4 5 6 7 8 9 |
var app = angular.module('myApp', []); app.controller('myCtrl', function($scope) { $scope.myText = "World"; $scope.myResult = function () { return "Hello " + $scope.myText + "!"; }; }); |
Szablon formularza w tabeli…
