myApp.controller('DashBoardController', ['$scope', function($scope) { $scope.profiles = [{ id: '1', firstname: 'ณเดชน์', lastname: 'คูกิมิยะ', nickname: 'ณเดชน์' }, { id: '2', firstname: 'เจษฎาภรณ์', lastname: 'ผลดี', nickname: 'ติ๊ก' }, { id: '3', firstname: 'สุธีวัน', lastname: 'ทวีสิน', nickname: 'ใบเตย' }, { id: '4', firstname: 'อุรัสยา', lastname: 'เสปอร์บันด์', nickname: 'ญาญ่า' }, { id: '5', firstname: 'พัชราภา', lastname: 'ไชยเชื้อ', nickname: 'อั้ม' }]; }]);
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Dara Ha-He by Nextflow</title> <script src="js/libs/angular.min.js"></script> <script src="js/app.js"></script> <script src="js/controllers/DashboardController.js"></script> </head> <body ng-app="myApp"> <h1>Dara Ha-He</h1> <div ng-controller="DashBoardController"> <label>ค้นหา: </label> <!-- Create input search here --> <input type="text" ng-model="keyword"> <!-- Add filter with search query --> <ul> <li ng-repeat="profile in profiles | filter:keyword"> {{profile.nickname}} {{profile.lastname}} ({{profile.nickname}}) </li> </ul> <hr> </div> </body> </html>