Question

 <body ng-app="app" key-trap>
    <div ng-controller="Controller">
        <input type="text" class="myInput form-control" name="txtStorename" id="txtStorename" placeholder="Search for Store.." title="Type in a Store" data-error-message="Please enter StoreName" ng-model="obj.sname">
        <ul ng-if="obj.sname && obj.showList" id="myUL" ng-repeat="StoreList in Store| filter:obj.sname">
            <li class="record" ng-class="($index == focusIndex)?'record-highlight':''" ng-cloak ng-click="SelectedValue(StoreList.StoreName)">{{StoreList.StoreName}}</li>
        </ul>
        <div ng-show="(Store|filter:obj.sname).length==0" style="color:red;font-weight:bold" ng-cloak>No Result Found</div>
    </div>

这是html代码。

          angular.module('app', [])
       .controller('Controller', function ($scope, $http, $filter) {
           $scope.obj = {};
           $scope.obj.showList = false;


           $scope.Getallitem = function () {
               $http.get('/Coupons/GetStore').success(function (data) {                 
                  $scope.Store = data

               });
           }
           $scope.Getallitem();

           $scope.SelectedValue = function (item) {
                $scope.obj.showList = false;
               $scope.obj.sname = item;
           }

           $scope.open = function (index) {

               var filteredContent = $filter('filter')($scope.Store, $scope.obj.sname);
               if (typeof filteredContent[index] !== 'undefined') {
                   var Storename = filteredContent[index];                
                   $scope.SelectedValue(Storename);
               }
           }

           $scope.focusIndex = -1;
           $scope.keys = [];
           $scope.keys.push({
               code: 13,
               action: function () {
                   $scope.open($scope.focusIndex);
               }
           });
           $scope.keys.push({
               code: 38,
               action: function () {
                   $scope.focusIndex--;
               }
           });
           $scope.keys.push({
               code: 40,
               action: function () {
                   $scope.focusIndex++;
               }
           });
           $scope.$watch('obj.sname', function () {
               if (!$scope.obj.showList) {
                   $scope.focusIndex = -1;
               }
           });
           $scope.$on('keydown', function (msg, obj) {

               var code = obj.code;
               if (code != 40 && code != 38 && code != 13) {
                   $scope.obj.showList = true;
               }
               var filteredContent = $filter('filter')($scope.Store, $scope.obj.sname);
               $scope.keys.forEach(function (o) {
                   if (o.code !== code) {
                       return;
                   }
                   if (code == 40) {

                       if (($scope.focusIndex + 1) >= filteredContent.length) {
                           return;
                       }
                   } else if (code == 38) {

                       if ($scope.focusIndex <= 0) {
                           return;
                       }
                   }
                   o.action();
                   $scope.$apply();
               });
           });
       })

     .directive('keyTrap', function () {
      return function (scope, elem) {
          elem.bind('keydown', function (event) {
              if (event.keyCode == 40 || event.keyCode == 38 || event.keyCode == 13) {
                  event.preventDefault();
              }
              scope.$broadcast('keydown', {
                  code: event.keyCode
              });
          });
      };
  });

这是脚本使用此代码的所有内容都很好，除了回车键。当我按下键盘上的回车键时，所选的值应填写在文本框中，该文本框也正常工作。唯一的是它返回值为[object Object]。而不是选定的值。

    [{"StoreName":"Flipkart"},{"StoreName":"BookmyFlower"},{"StoreName":"Thomas Cook Flights"},{"StoreName":"BigFlix"}]

价值观的结构是这样的。

单击按钮时，角度js值显示为空

0 个答案: