Question

使用angular xeditable typehead指令显示自动完成下拉菜单。我从页面上的json文件中获取数据，并使用jso数组进行e-typeahead。当我在输入类型中键入内容时，它显示数组中的匹配值。但是当我从列表中选择任何值时，它不会更新模型以及view.My文件如下所示：

conroller.js

var payApp = angular.module('payRoll', ["xeditable", "ui.bootstrap"]);

payApp.controller('mainCtrl', function($scope, $http, $window,$location, $filter) {
$scope.Zip_City_options = ["1000  BOURG EN BRESSE",
    "1000  BROU",
    "1000  ST DENIS LES BOURG",
    "1090  AMAREINS",
    "1090  AMAREINS FRANCHELEINS CES",
    "1090  CESSEINS",
    "1090  GENOUILLEUX",
    "1090  GUEREINS",
    "1090  LURCY",
    "1090  MONTCEAUX",
    "1090  MONTMERLE SUR SAONE",
    "1100  APREMONT",
    "1100  ARBENT",
    "1100  BOUVENT",
    "1100  GEOVREISSET",
    "1100  OYONNAX",
    "1100  VEYZIAT",
    "1110  ARANC",
    "1110  BRENOD",
    "1110  CHAMPDOR",
    "1110  CORCELLES"];
   });

html就像：

<div  ng-controller="mainCtrl">
   <span  class="list-group-item">
      <a href="#" ng-model="zip_code" editable-text="zip_code" e-typeahead="city for city in Zip_City_options | filter:$viewValue | limitTo:8">
         {{ zip_code || '58.29C' }}
      </a>                       
   </span>
</div>

Answer 1

将您的控制器更改为以下

    var payApp = angular.module('payRoll', ["xeditable", "ui.bootstrap"]);

    payApp.controller('mainCtrl', function($scope, $http, $window,$location, $filter) {
    $scope.Zip_City_options = ["1000  BOURG EN BRESSE",
        "1000  BROU",
        "1000  ST DENIS LES BOURG",
        "1090  AMAREINS",
        "1090  AMAREINS FRANCHELEINS CES",
        "1090  CESSEINS",
        "1090  GENOUILLEUX",
        "1090  GUEREINS",
        "1090  LURCY",
        "1090  MONTCEAUX",
        "1090  MONTMERLE SUR SAONE",
        "1100  APREMONT",
        "1100  ARBENT",
        "1100  BOUVENT",
        "1100  GEOVREISSET",
        "1100  OYONNAX",
        "1100  VEYZIAT",
        "1110  ARANC",
        "1110  BRENOD",
        "1110  CHAMPDOR",
        "1110  CORCELLES"];

    $scope.model = {
       zip_code: null
    };
});

将您的标记更改为以下

    <div  ng-controller="mainCtrl">
    <span  class="list-group-item">
    <a href="#" editable-text="model.zip_code" e-typeahead="city for city in Zip_City_options | filter:$viewValue | limitTo:8">
          {{ zip_code || '58.29C' }}
   </a>                  

   </span>
   </div>

Angularjs x editable typeahead不更新范围

1 个答案: